知识 分享 互助 懒人建站

    懒人建站专注于网页素材下载,提供网站模板、网页设计、ps素材、图片素材等,服务于【个人站长】【网页设计师】和【web开发从业者】的代码素材与设计素材网站。

    懒人建站提供网页素材下载、网站模板
    知识 分享 互助!

    jquery的自定义事件通过on绑定trigger触发

    作者:佳明妈 来源:jquery插件 2015-05-04 人气:
    jquery绑定自定义事件,可以实现预先绑定好一个处理方法,当需要使用的时候利用jquery trigger来触发自定义事件,以达到方便快捷的目的。
    jquery绑定自定义事件,可以实现预先绑定好一个处理方法,当需要使用的时候利用jquery trigger来触发自定义事件,以达到方便快捷的目的。
    我们来假设一个这样的场景,一个textarea中的字数计算,如果是直接键盘输入或者粘贴进来的话,是可以使用input方法检测到,但是如果是通过js插入的文本,这个时候input事件就监测不到了,
    这个时候如果我们事先给绑定一个myChange事件,它的回调函数就是来处理计算其中的文本字数的,我们在使用js给这个textarea赋值以后,连缀写上.trigger("myChange")就可以计算到。

    下面的jquery自定义事件只是一个简单测试。有需要的朋友可以尝试着做些更实用的功能

    <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触发由懒人建站收集整理,您可以自由传播,请主动带上本文链接

    懒人建站就是免费分享,觉得有用就多来支持一下,没有能帮到您,懒人也只能表示遗憾,希望有一天能帮到您。

    jquery的自定义事件通过on绑定trigger触发-最新评论

    • 11 2016-06-29 04:06:35
      44444444444444444444
    • 11 2015-11-02 01:11:56
      枪支弹药热卖,成人小电影,这个还能发布,那这个多说过滤系统有毛用啊!
    • 11 2015-11-02 01:11:55
      www.baidu.com
    • 11 2015-11-02 01:11:55
      www.baidu.com
    • 11 2015-11-02 01:11:28
      还可以哦
    • 11 2015-11-02 01:11:20
      http://www.51xuediannao.com/js/jquery/832.html
    • 11 2015-11-02 01:11:19
      感谢站长分享~
    • 11 2015-10-28 11:10:35
      博主你太好了
    • 11 2015-10-09 03:10:06
      牛啊,想不到的强文
    • 11 2015-10-05 05:10:14
      jquery的自定义事件通过on绑定trigger触发 可以用来做 观察者模式