js模拟用户点击弹出新页面-幸凡学习网

js模拟用户点击弹出新页面

关注我吧

2016/4/14 16:11:40 阅读次数:6727Tags:js 弹窗

1、前言：

相信用过window.open的小伙伴们都遇到过被浏览器拦截导致页面无法弹出的情况；我们换下思路，什么情况下的新页面弹出才不会被浏览器拦截呢？比如<a>标签这种就不会；那么我们只要模拟下用户去主动点击这个<a>标签就不会有拦截的问题了。当然并不是点击a的链接，而是点击a里面的内容才会有效果，不信你可以试试。

效果图如下：

js模拟用户点击弹出新页面

2、主要实现代码

HTML部分：

<a href="" id="linka" target="_blank" style="display:none"><span id="linkspan">test</span></a>
<input type="button" value="点我弹出新页面" onclick="targetClick()" />

js部分:（标签赋值并触发里面的span点击事件）

function targetClick() {
     $("#linka").attr("href", "http://www.86y.org");
     $("#linkspan").click();
     return false;
}

3、完整版html演示

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js模拟用户点击弹出新页面</title>
</head>
<body>
<a href="" id="linka" target="_blank" style="display:none"><span id="linkspan">test</span></a>
<input type="button" value="点我弹出新页面" onclick="targetClick()" />
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
function targetClick() {
     $("#linka").attr("href", "http://www.86y.org");
     $("#linkspan").click();
     return false;
}
</script>
</body>
</html>

4、结语

OK，这下页面的弹出就畅通无阻了。