通常我们想要浏览器在回调方法中打开一个页签,用这个方法

//window.open("http://www.baidu.com") ;       //自动打开新窗口,会被浏览器拦截,无效

但是事实上,这个会被浏览器自动拦截掉,那该怎么办呢?

我们可以模拟一个链接被点击,这样就不会被拦截了,代码如下:

//打开新窗口,一切事件都调用该方法
        function openNewWindow() {
            //var a = $('a')[0];
            let a = $("<a href='http://www.baidu.com' target='_blank'>baidu</a>").get(0);
            let e = document.createEvent('MouseEvents');
            e.initEvent( 'click', true, true );
            a.dispatchEvent(e);
        }

完整的demo我也发一个给大家:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title> <link rel="shortcut icon" href="/favicon.ico" />
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="test">
<meta http-equiv="description" content="test">
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
<script>
$(function () {
//window.open("http://www.baidu.com") ; //自动打开新窗口,会被浏览器拦截,无效 //openNewWindow();//自动打开新窗口,模拟一个链接的点击事件,不会被拦截,推荐做法 //单击某个元素打开
$(".click").click(function(){
openNewWindow();
}); //双击某个元素打开
$(".dblclick").dblclick(function(){
openNewWindow();
}); //鼠标进去某个元素打开
$(".mouseenter").mouseenter(function(){
openNewWindow();
}); /**
* 如果想要其他事件,请参考
* 慕课网事件讲解:http://www.imooc.com/learn/429
* 菜鸟网事件分类:http://www.runoob.com/jquery/jquery-events.html
* W3school事件列表:http://www.w3school.com.cn/jquery/jquery_ref_events.asp
*/ }); //打开新窗口,一切事件都调用该方法
function openNewWindow() {
//var a = $('a')[0];
let a = $("<a href='http://www.baidu.com' target='_blank'>baidu</a>").get(0);
let e = document.createEvent('MouseEvents');
e.initEvent( 'click', true, true );
a.dispatchEvent(e);
}
</script> </head>
<body>
测试默认页面 <div class="click">click单击事件跳转</div>
<div class="dblclick">dblclick双击事件跳转</div>
<div class="mouseenter">mouseenter鼠标进去事件跳转</div> </body>
</html>

转自:https://blog.csdn.net/lengguoxing/article/details/78413595

【转发】jquery实现自动打开新的页签的更多相关文章

  1. H5拖动火狐自动打开新标签

    写在前面的话:<H5拖动火狐自动打开新标签>原因是为什么百度很多了我就不细说,本文章只说我自己的解决方法... 自定义数据里写个链接,如果火狐自动打开就跳到这个链接 这个页面就写一句话:关 ...

  2. chrome打开新标签页插件

    标签(空格分隔): 日常办公,chrome浏览器 一直被chrome浏览器打开新标签页困扰,每次点开一个新标签页还要再去点一下主页,才能打开搜索页面.如果直接点击主页,又会把当前的页面刷掉,实在是非常 ...

  3. Firefox火狐浏览器打开新标签页一直闪烁

    问题:Firefox浏览器打开新标签页一直刷新,不能打开页面 解决办法:在url栏输入about:support,打开配置文件夹,然后删除目录中包含storage所有文件,重启Firefox即可.

  4. 小程序 webview 自动打开新页面

    小程序 webview 自动打开新页面 iframe 效果 https://nervjs.github.io/taro/docs/components/open/web-view.html 怎么阻止小 ...

  5. 【解决方案】chrome打开新标签页自动打开chrome://newtab并且跳转到谷歌香港

    简述天,昨天开始遇到这个问题,还没有留心,结果今天多次使用chrome的时候,就发现有些不对了..打开chrome的新标签页,结果出现了自动跳转的问题我自动跳转的是下面这个网页:https://www ...

  6. selenium 打开新标签页(非窗口)

    如何利用webdriver打开多个标签页和链接呢,到处查找得到的往往只是如何打开标签页. 打开标签页很简单,浏览器打开标签页的快捷键是ctrl+t,那把ctrl+t的按键事件传入即可,很多种实现方式, ...

  7. AJAX 请求后使用 JS 打开新标签页被阻止的解决方法

    需求:发起一个 AJAX 请求,根据请求结果来打开一个新页面. 问题:AJAX 请求后,使用 window.open() 方法来打开新页面会被浏览器阻止. 解决方法:在 AJAX 请求之前,就使用 c ...

  8. chrome 版本 29.0.1547.76 m 解决打开新标签页后的恶心页面的问题

    个人非常不喜欢这个版本的新标签页的样子,特别是一再输入框中输入要搜索的东西,自动跑到标题栏中去了,比吃屎还恶心.下面是解决办法: 在地址栏输入:chrome://flags/ 按Ctrl+F,输入下面 ...

  9. chrome新版打开新标签页自动打开谷歌主页

    最近更新了chrome,发现新版有个问题. 打开标签页时会自动跳转至 https://www.google.com/webhp?ie=UTF-8&gws_rd=cr&rct=j 导致我 ...

随机推荐

  1. sqlserver一次性修改多条

    修改客户表 编号为 0101007002,0101007003的楼栋号  007-1-102,007-1-201 UPDATE gas_customerSET building= CASEWHEN g ...

  2. springboot设置访问端口和项目路径

    找到,application.properties, 添加如下配置即可 server.port=8088server.servlet.context-path=/

  3. Docker 0x04: Docker 基本使用

    目录 Docker 基本使用 第一步:明确要使用容器运行的应用的镜像相关 第二步:运行一个官方nginx应用 第三步:单纯下载镜像,pull 第四步:设置国内docker-hub 第五步:列出已有镜像 ...

  4. postgresql9.5编译安装体验

    实验环境: centos7.6 pgsql9.5 源码编译安装 实验目的: 体验源码编译安装pgsql 01.download https://ftp.postgresql.org/pub/sourc ...

  5. watch - 实时查看命令执行结果

    watch - execute a program periodically, showing output fullscreen 定期执行一个程序,全屏显示输出 watch重复运行命令,显示其输出和 ...

  6. python应用-输入三个数,输出其最大值

    """ 输入三个数,输出其最大值 Author:罗万财 Date:2017-7-6 """ a=int(input('a=')) b=int ...

  7. TCP滑动窗口(发送窗口和接受窗口)

    TCP窗口机制 TCP header中有一个Window Size字段,它其实是指接收端的窗口,即接收窗口.用来告知发送端自己所能接收的数据量,从而达到一部分流控的目的. 其实TCP在整个发送过程中, ...

  8. Flutter在iOS上的表现就是一坨屎

    Flutter在iOS上的表现就是一坨屎: 用户体验差到了极点: 目前来说不值得投入大量精力去研究: 了解一下原理可以.

  9. jsbridge与通信模型

    三层通信模型: 应用层.解释层.会话层: 通信协议: 通信原语: 报文格式: 网络层: _evaluateJavascript 会话层: #define kQueueHasMessage   @&qu ...

  10. Spring @Scheduled定时任务的fixedRate,fixedDelay,cron的作用和不同

    一.   三种定时类型. 1.cron  --@Scheduled(cron="0/5 * * * *?") 当时间达到设置的时间会触发事件.上面那个例子会每5秒执行一次. 201 ...