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

//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. MyCat教程一:MyCat的简单介绍

    MyCat教程二:mysql主从复制实现 MyCat教程三:安装及配置介绍 MyCat教程四:实现读写分离 MyCat教程五:实现分库分表 MyCat教程六:全局序列号-全局主键的自增长 一.MyCa ...

  2. C# 获取指定类型的文件

    C# 获取指定类型的文件 public static List<FileInfo> getFile(string path, string extName) { List<FileI ...

  3. Miniconda安装 虚拟环境创建 与包管理

    安装python 之前安装python包,导致了python里面的包不兼容,用管理工具卸载也下载不掉,重新安装也安装不上,没有办法只能卸掉python重装. 安装Anaconda Anaconda指的 ...

  4. Hibernate各种状态(瞬时状态、持久化状态、游离|托管状态)之间的转换

  5. 关于ping github.com超时的解决办法

    今天在使用git的时候执行将本地分支推送到远程分支的push操作时(同时为远程库创建和本地分支同名的分支),遇到了超时的错误,经过查询全网各位大牛的操作这里给出有效解决方式 进入C:\Windows\ ...

  6. jmeter中设置线程数与设置集合点的区别

    1.设置线程数: 表示10秒内启动50个线程, 运行结果如下:10秒内启动了50个线程 2.设置集合点: Number of Simulated Users to Group by:50,表示集合50 ...

  7. springboot-注解-@Repository、@Service、@Controller 和 @Component

    Spring 2.5 中除了提供 @Component 注释外,还定义了几个拥有特殊语义的注释,它们分别是:@Repository.@Service 和 @Controller.在目前的 Spring ...

  8. JQuery系列(5) - Deferred对象

    从jQuery 1.5.0版本开始引入的一个新功能----deferred对象. 简单说,deferred对象就是jQuery的回调函数解决方案.在英语中,defer的意思是"延迟" ...

  9. 【Postgres】根据字段数据创建空间字段

    --添加空间字段 , ); --根据其他字段更新空间字段数据 update "GIS" b ) from "GIS" a where b."ID&qu ...

  10. React Core Features

    React Core Features Here is a summary of the core features. We will cover each feature in detail thr ...