关于jquery的click()方法
昨天,有个同事研究了以下jqury的click()方法,代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#ago').click(function () { $('#a01').click();
$('#a02').click(); });
});
$(function () {
$("#a01").click( function () {
window.open("http://www.baidu.com" ) });
})
$(function () {
$("#a02").click( function () {
window.open("http://www.g.cn" ) });
})
</script>,
</head>
<li><a id="a01" target="_blank" href="http://www.baidu.com">www.baidu.com</a></li>
<li><a id="a02" target="_blank" href="http://www.g.cn">www.g.cn</a></li>
<br>
<button id="ago" style="border: 1px solid black;cursor: pointer">更新</button> </body>
</html>
如上代码,在chrom和Firefox IE 完全不一样。在chrome上只能打开一个窗口,而其他浏览器在点击更新的时候,可以同时打开2个页面。
经查资料:
Safari/Chrom只有在标签input/button情况下,支持click方法,而我们的例子中非如上标签。所以,我们在调用click()方法的时候,出现问题。
既然不支持jquery的方法,那我们使用dom的dispatchEvent方法,这样就支持了。代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
function dispatch(el, type){
try{
var evt = document.createEvent('Event');
evt.initEvent(type,true,true);
el.dispatchEvent(evt);
}catch(e){alert(e)}
}
$(function () {
$("#ago").click(function () {
var a01 = document.getElementById('a01');
var a02 = document.getElementById('a02');
dispatch(a02, 'click');
dispatch(a01, 'click'); }) });
$(function () {
$("#a01").click( function () {
window.open("http://www.baidu.com" ) });
});
$(function () {
$("#a02").click( function () {
window.open("http://www.g.cn" ) });
})
</script>
</head>
<li><a id="a01" target="_blank" href="http://www.baidu.com">www.baidu.com</a></li>
<li><a id="a02" target="_blank" href="http://www.g.cn">www.g.cn</a></li>
<br>
<button id="ago" style="border: 1px solid black;cursor: pointer"><a id=""></a>更新</button> </body>
</html>
关于jquery的click()方法的更多相关文章
- jQuery 事件 click() 方法,dblclick() 方法
click() 方法 当点击元素时,会发生 click 事件. 当鼠标指针停留在元素上方,然后按下并松开鼠标左键时,就会发生一次 click. click() 方法触发 click 事件,或规定当发生 ...
- JQuery实现click事件绑定与触发方法分析
原生JS通过什么方法绑定click事件? 原生js有一下三种方法为DOM对象绑定click事件, 第一种,在html中添加 onclick属性,在此属性中添加要绑定的事件函数,如下, 这种方法为htm ...
- jquery click()方法模拟点击事件对a标签不生效的解决办法
阅读数:8971 <a href="www.baidu.com"></a> 1 问题分析 点击A标签本身,并不会触发跳转到指定链接的事件,就是说,我们平时都 ...
- jquery click()方法模拟点击事件对a标签不生效
if(e.keyCode == 13) { $items.eq(index).click(); return; } 搜索框下拉列表模拟点击时间,使用上述代码不能触发链接跳转 1,页面使用了bootst ...
- jquery click()方法 语法
jquery click()方法 语法 作用:当点击元素时,会发生 click 事件.当鼠标指针停留在元素上方,然后按下并松开鼠标左键时,就会发生一次 click.click() 方法触发 click ...
- 避免jquery的click多次绑定方法
$("#xxx").click(function(){}) 这样只是会在原click方法中继续添加新方法: 当然解决办法是解绑: $("#xxx").unbin ...
- jquery 通过submit()方法 提交表单示例
jquery 通过submit()方法 提交表单示例: 本示例:以用户注册作为例子.使用jquery中的submit()方法实现表单提交. 注:本示例仅提供了对表单的验证,本例只用选用了三个字段作为测 ...
- jquery.on()超级方法
$.on()方法是jquery1.7之后的一个超级方法,将事件绑定和事件委托整合到一个函数中去,支持绑定多个事件,并且可以绑定自定义事件.使用起来很方便. demo传送门 事件委托 首先说一下事件委托 ...
- jquery的ready方法(DOM是否加载完)详解与使用
jquery的ready方法(准备DOM触发)还是比较复杂的,我们先看流程图:
随机推荐
- Python 两个list合并成一个字典
方法一:list1 = ['k1','k2','k3'] list2 = ['v1','v2','v3'] dic = dict(map(lambda x,y:[x,y],list1,list2)) ...
- HwUI下载地址
下载地址:HwUI.0.0.1.zip
- CSS流体(自适应)布局下宽度分离原则——张鑫旭
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1463 一.简短的前言 ...
- 转:Jquery如何获取某个元素前(后)的文本内容?
原文:[解决]Jquery如何获取某个元素前(后)的文本内容? <span> text here... <a id="target_element">百万创 ...
- the cause of StringBuild class
如果我们对字符串进行拼接操作,每次拼接,都会创建一个新的String对象,既耗时,又浪费空间,而StringBuild类可以解决这个问题. 那么StringBuild类是如果解决的呢? 因为Strin ...
- MySQL无法启动、服务没有报告任何错误&初次登陆错误的解决
先以管理员身份运行cmd(右键单击左下角win菜单) 输入mysqld -install,net start mysql,下图是返回结果.报错情况以及修正之后的全过程 启动失败之后输入mysqld - ...
- Oracle EBS PO采购订单更新
DECLARE l_result NUMBER; l_progress NUMBER; l_errors PO_API_ERRORS_REC_TYPE; l_chg PO_CHANGES_REC_TY ...
- [WinCE] Win CE 屏幕截图
VS2005自带了这个工具,这个工具的名称为:“远程放大”,其路径为:"C:\Program Files\CE Remote Tools\5.01\bin\cczoom.exe" ...
- Entity Framework的几种初始化器
Database.SetInitializer<TContext>(new NullDatabaseInitializer<TContext>()); Database.Set ...
- [UI] MFD UI kit
MFD UI kit https://dribbble.com/whaledesigned