jQuery 处理iframe内 接管a 标签请求
用处:
在Electron 做桌面程序时,有时会用到web页面,当页面中存在 a标签时,如果点击会使用原先的窗口弹出程序,但我们会想着修改成 Web Browser和指定窗口打开,这是就需要拦截页面内的a标签事件,常用的a标签target值如下
依赖项:jquery.js
下面是推荐使用方法,具体参考 electron的webview标签之新开窗口
这个方法需要将iframe改成webview,iframe能不能使用没有测试过。
$(webSelector).on('new-window', (e) => {
var url = e.url||e.originalEvent.url;
if (url.indexOf('http:')>=0 || url.indexOf('https:')>=0) {
//shell.openExternal(e.url)
callback(url);
//window.open(url)
}
});
以下的方法之前的解决方法并不好,当嵌套页面过多时,会有漏网之鱼,***不推荐***
/**
* 接管所有弹出窗口请求
* 使用回调函数处理 需要接管后的操作
* @param iframe jquery iframe对象
* @param target 接管的Tager类型 [_blank 在新窗口中打开被链接文档。_self 默认。在相同的框架中打开被链接文档。_parent 在父框架集中打开被链接文档。_top 在整个窗口中打开被链接文档。framename 在指定的框架中打开被链接文档。]
* @callback 回调函数,会返回2个参数 [e:所有target="_black"点击的事件源;url 获取到的url路径]
*/
iframeTargetClick:function(iframe,target,callback){
if(typeof target=="function"){
callback=target;
target=undefined;
}
var find=!target?"a:not([href^='#'])":"[target='"+target+"']";
iframe.load(function(){
iframe.contents().find(find).click(function(e){
var url=$(this).attr("href");
callback(e,url)
});
var ifrmaes=iframe.contents().find("iframe");
if(iframes.length>0){
for(var i=0;i<iframe.length;i++){
$.fn.iframeTargetClick($(iframe[i]),target,callback);
}
}
});
外部调用
$.iframeTargetClick($("#frame"),"_blank",function(e,url){
openToBrowser(url,e);
});
补充 openToBrowser
(electron 用浏览器打开方法)方法
const shell = require('electron').shell;
/**
* 使用浏览器打开url
* @param url 打开的url
* @param e 点击事件源,可选,如果不填则需要手动 处理保证事件不在处理
*/
function openToBrowser(url,e){
(e)&&(e.preventDefault()); //给页面该事件不在处理
shell.openExternal(url);
}
如果有好的方法,请大神指点