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

//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. 国内不fq安装K8S二: 安装kubernet

    目录 2 安装kubelet 2.1 环境准备 2.2 设置国内的源 2.3 重要的设置 2.4 获取镜像 2.5 使用kubeadm init初始化集群 2.6 安装Pod Network 2.7 ...

  2. RabbitMQ的使用Demo

    rabbitmq消息队列,官网有六种,实战常用的也就如下五种. 下面开始demo讲解 大致三步:1.配置消息队列,2.生产者提供消息给队列,3.消费者监听消费队列消息 源码下载:https://pan ...

  3. C++学习（4）——通讯录管理程序

    复习简单操作,实现一个非常非常简单的通讯录管理小程序 #include <iostream> using namespace std; #include <string> co ...

  4. thrift rpc通信

    thrift rpc通信 框架 别人的简历: 负责抓取程序的开发和维护,对抓取内容进行数据提取.整理.1.定向数据抓取程序的维护和开发,了解了Sqlite数据库.Thrift服务和多线程的开发调试.2 ...

  5. P1092 虫食算[搜索]

    这个式子是是由\(A\sim A+N\)组成的,那么\(A\sim A+N\)就只能等于\(0\sim N-1\),因此我们每次对\(A\sim A+N\)的取值做一个新的排列,然后judge一下当前 ...

  6. Spring Cloud Config 知识点

    Spring Cloud Config项目是一个解决分布式系统的配置管理方案.它包含了Client和Server两个部分,server提供配置文件的存储.以接口的形式将配置文件的内容提供出去,clie ...

  7. 【大数据】虚拟机网络配置-CentOS

    cd /etc/sysconfig/network-scripts/ vi ifcfg-enoXXXX vi /etc/hostname

  8. Unable to load bean org.apache.struts2.dispatcher.multipart.MultiPartRequest

    Unable to load bean org.apache.struts2.dispatcher.multipart.MultiPartRequest (jakarta) 把commons-ileu ...

  9. 17-Flutter移动电商实战-首页_楼层区域的编写

    1.楼层标题组件 该组件非常简单,只接收一个图片地址,然后显示即可: class FloorTitle extends StatelessWidget {  final String picture_ ...

  10. 洛谷 P2577 [ZJOI2005]午餐 题解

    每日一题 day56 打卡 Analysis 算法:贪心+dp 容易想到贪心:吃饭慢的先打饭节约时间, 所以先将人按吃饭时间从大到小排序. 然后就是dp了: 首先,应该想到f[i][j][k]:前i个 ...