使用jQuery在javascript中自定义事件
js中的自定义事件有attachEvent,addEventListener等等好多种,往往受困于浏览器兼容,而且代码写起来也相当麻烦。jQuery为我们解决了这个问题,几行代码就可以很好的实现事件的各种传递。
例如,我要点击一个button,现在要将这个点击事件抛出来,从其他任何想要的地方去接收;
这个是button
<button name="btn" onclick="clickbtn()">按钮</button>
js:
var btn=$("button");
btn.bind("evtClick",function(evt,v1,v2){alert("success:"+v1+v2);});
function clickbtn(){
btn.trigger("evtClick",["value1","value2"]);
}
第一行,通过jQuery获得这个dom元素对象
第二行,添加一个事件监听evtClick,并对其实现处理方法
第三行,在clickbtn中添加事件触发,事件的名字叫做“evtClick”,并且传递一个数组存放所有的传递的参数,第二行,事件处理部分就按照这个传递的规则实现
几行代码就实现了事件抛出机制。当然,这样写或许再少一行代码:
$("button").bind("evtClick",function(evt,v1,v2){alert("success:"+v1+v2);});
function clickbtn(){
$("button");.trigger("evtClick",["value1","value2"]);
}
循环创建多个div,抛出事件到外部对象:
for (var i=0; i < 10; i++) {
var myJimmy = new Jimmy(1,"www.bai1du.com"+i,"jimmychu");
var btn=myJimmy.createButton();
btn.type="button";
btn.value="按钮"+i;
body.appendChild(btn);
var btnJQuery=jQuery(btn);//所有需要使用jquery的dom必须要用jQuery包装起来
(function(btn,obj){
btn.click(function(){
btn.trigger("evtClick",[obj.url]);
});
})(btnJQuery,myJimmy);
btnJQuery.bind("evtClick",function(evt,v1){alert(v1);});//可以写到外部调用该对象的类里边,实现事件的传递
}
注意:jQuery中事件名称不能与函数方法名称相同,如果相同则不能进入方法
如上述触发的事件为“evtClick”,不能有如下的函数
function evtClick(){
//something
}
使用jQuery在javascript中自定义事件的更多相关文章
- javascript中自定义事件
自定义事件:用户可以指定事件类型,这个类型实际上就是一个字符串,然后为这个类型的事件指定事件处理函数,可以注册多个事件处理函数(用数组管理),调用时,从多个事件处理函数中找到再调用. function ...
- jQuery文本框中的事件应用
jQuery文本框中的事件应用 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "ht ...
- js实例分析JavaScript中的事件委托和事件绑定
我们在学习JavaScript中,难免都会去网上查一些资料.也许偶尔就会遇到“事件委托”(也有的称我“事件代理”,这里不评论谁是谁非.以下全部称为“事件委托”),尤其是在查JavaScript的事件处 ...
- 详解javascript实现自定义事件
这篇文章主要为大家介绍了javascript实现自定义事件的方法,自定义事件,顾名思义,就是自己定义事件类型,自己定义事件处理函数,javascript如何实现自定义事件,需要了解的朋友可以参考下 我 ...
- JavaScript中的事件循环机制跟函数柯里化
一.事件循环机制的理解 test();//按秒输出5个5 function test() { for (var i = 0; i < 5; i++) { setTimeout(() => ...
- javascript 中的事件机制
1.javascript中的事件. 事件流 javascript中的事件是以一种流的形式存在的. 一个事件会也有多个元素同时响应. 有时候这不是我们想要的效果, 我们只是需要某个特定的元素相应我们的绑 ...
- JavaScript中的事件对象
JavaScript中的事件对象 JavaScript中的事件对象是非常重要的,恐怕是我们在项目中使用的最多的了.在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含这所有与事件有 ...
- JavaScript 进阶教程一 JavaScript 中的事件流 - 事件冒泡和事件捕获
先看下面的示例代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Jav ...
- JQuery在循环中绑定事件的问题详解
JQuery在循环中绑定事件的问题详解 有个页面上需要N个DOM,每个DOM里面的元素ID都要以数字结尾,比如说 ? 1 2 3 <input type="text" nam ...
随机推荐
- java高并发之锁的使用以及原理浅析
锁像synchronized同步块一样,是一种线程同步机制.让自Java 5开始,java.util.concurrent.locks包提供了另一种方式实现线程同步机制——Lock.那么问题来了既然都 ...
- jar包、war包
JavaSE程序可以打包成Jar包(J其实可以理解为Java了),而JavaWeb程序可以打包成war包(w其实可以理解为Web了).然后把war发布到Tomcat的webapps目录下,Tomcat ...
- Netty源码分析第5章(ByteBuf)---->第2节: ByteBuf的分类
Netty源码分析第五章: ByteBuf 第二节: ByteBuf的分类 上一小节简单介绍了AbstractByteBuf这个抽象类, 这一小节对其子类的分类做一个简单的介绍 ByteBuf根据不同 ...
- 私有云搭建:树莓派+kodexplorer可道云,几步搞定!
目前蒲公英异地组网则是推出了树莓派1.0软件客户端.无需公网IP!简单60秒设置!轻松远程访问树莓派!实现远程登录.远程配置.远程访问服务.传输数据等等操作.例如:蒲公英树莓派1.0软件客户端+可道云 ...
- django-simple_tag、filter
simple_tag与filter的用法 1.支持自定义函数处理方法 2.支持模板调用 创建步骤: a.在app目录下创建templatetags文件夹 b.在templatetags中创建任意名称. ...
- ossec安装
安装 安装要求 对于Unix系统来说,OSSEC只需要GNU的make.gcc和libc.推荐使用OpenSSL,但仅属于一个可选项.而且,通常您只需在一个系统上做编译操作,然后将二进制程序复制到其他 ...
- Centos7.2构建Python3.6开发环境
1.安装python3.6 1.这里使用一台全新的腾讯云主机,首先获取linux系统版本信息. [root@VM_46_121_centos ~]# cat /etc/redhat-release C ...
- Python参数传递,既不是传值也不是传引用
面试的时候,有没有被问到Python传参是传引用还是传值这种问题?有没有听到过Python传参既不是传值也不是传引用这种说法?一个小小的参数默认值也可能让代码出现难以查找的bug? 如果你也遇到过上面 ...
- Python基础_eval(),exec(),globals(),locals(),compile()
转发:http://www.cnblogs.com/yyds/p/6276746.html 1. eval函数 函数的作用: 计算指定表达式的值.也就是说它要执行的Python代码只能是单个运算表达式 ...
- Javascript开发者 常用知识
Javascript是一种日益增长的语言,特别是现在ECMAScript规范按照每年的发布时间表发布.伴随着这门语言的规模化和快速发展,掌握JS(不仅仅是jQuery)的重要性,变得更加重要. 这不是 ...