首页 > 代码库 > jquery的自定义事件通过on绑定trigger触发
jquery的自定义事件通过on绑定trigger触发
jquery绑定自定义事件,可以实现预先绑定好一个处理方法,当需要使用的时候利用jquery trigger来触发自定义事件,以达到方便快捷的目的。
我们来假设一个这样的场景,一个textarea中的字数计算,如果是直接键盘输入或者粘贴进来的话,是可以使用input方法检测到,但是如果是通过js插入的文本,这个时候input事件就监测不到了,
这个时候如果我们事先给绑定一个myChange事件,它的回调函数就是来处理计算其中的文本字数的,我们在使用js给这个textarea赋值以后,连缀写上.trigger("myChange")就可以计算到。
测试代码:
<textarea id="textarea"></textarea><p><button type="button" id="btn1">jquery自定义事件-事件注册</button></p><p><button type="button" id="btn2">jquery自定义事件-测试触发</button></p><p style="margin-top: 100px;"><a href="http://www.51xuediannao.com/">懒人建站</a>http://www.51xuediannao.com/整理</p><script src="http://libs.useso.com/js/jquery/1.11.1/jquery.min.js"></script><script> $btn1 = $("#btn1"); //jquery定义一个自定义事件 diyEvent 注意:回调函数中的第一个参数是事件,需要接受其他参数的话,在后面跟上其他参数即可 不太好表述,仔细对照“调用示例”能看明白 $btn1.on("diyEvent",function(event,a,b,fun){ console.log(a,b); fun(); }); //jquery自定义事件触发示例, 注意: trigger传入的参数第一个是自定义的事件名,第二个参数是一个数组,数组中的项会和自定义事件中回调的参数项对应 $("#btn2").click(function(){ $btn1.trigger("diyEvent",["11","22",function(){alert("懒人建站")}]) }) //我们来测试一下 textarea 这个场景 var haHa = function(){ var test = function($el){ var len= $el.val().length; console.log(len) }; $("#textarea").on("input propertychange",function(){ test($(this)); }).on("myChange",function(){ test($(this)); }); }; haHa(); $btn1.click(function(){ $("#textarea").val("jquery的自定义事件通过on绑定trigger触发").trigger("myChange") })</script>
本文链接:jquery的自定义事件通过on绑定trigger触发http://www.51xuediannao.com/js/jquery/832.html
jquery的自定义事件通过on绑定trigger触发
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。