关于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触发)还是比较复杂的,我们先看流程图:
随机推荐
- js-权威指南学习笔记15.2
1.读取Element的innerHTML属性作为字符串标记返回那个元素的内容. 2.当设置元素的outerHTML时,元素本身被新的内容所替换.只有Element节点定义了outerHTML属性,D ...
- 计算mysql中某个字段某字符出现的次数,case when 和 截取字符的用法
select LENGTH(type) - LENGTH(replace(type,'_','')) as counts from sa_log_olap where type like 'XX_XX ...
- FineReport中如何自定义登录界面
在登录平台时,不希望使用FR默认的内置登录界面,想通过自定义登录界面实现登录操作,内置登录界面如下图: 登录界面,获取到用户名和密码的值,发送到报表系统,报表服务带着这两个参数访问认证地址进行认证. ...
- Android 应用安装
DDMS下Files Explorer /data/app/xxx.apk 安装过程:1.拷贝文件xxx.apk到/data/app/xxx-1.apk 2.在/data/data目录下创建一个文件夹 ...
- 实现自定义Session
1. 回话状态接口 /// <summary> /// 会话状态策略接口 /// </summary> public partial interface ISessionStr ...
- 使用 Azure CLI 创建和管理 Linux VM
Azure 虚拟机提供完全可配置的灵活计算环境. 本教程介绍 Azure 虚拟机的基本部署项目,例如选择 VM 大小.选择 VM 映像和部署 VM. 你将学习如何执行以下操作: 创建并连接到 VM 选 ...
- mongodb/python3.6/mysql的安装
1 下载与解压 在官网下载mongodb安装包 tar -zxvf mongodb-linux-x86_64-ubuntu1604-3.4.0.tgz 2 移动安装文件 sudo mv mongodb ...
- [翻译] BKZoomView
BKZoomView https://github.com/freshking/BKZoomView A UIView that will zoom into its parent view. It ...
- centos7.4之zabbix4.0的fping监控
参考博文: https://www.cnblogs.com/lei0213/p/8859326.html 注释:他是额外安装fping的:因为我yum安装的zabbix,fping就已经自带了:安装步 ...
- jiekou
接口 新的接口 package cn.eangaie.jingdong.controller; import cn.eangaie.jingdong.entity.Result; import c ...