首页 > 代码库 > on事件绑定阻止冒泡的问题

on事件绑定阻止冒泡的问题

当使用on进行事件绑定时当要给document绑定click,而子元素要禁止冒泡,那么子元素里面的子元素的click事件就会无效了,

下面无效版:

$(‘#queue‘).on(‘click‘, ‘.link‘, function() {
        var t = $(this)
        ,box = t.next()
        if(t.hasClass(‘active‘)) {
            box.hide()
            t.removeClass(‘active‘)
        }
        else {
            box.show()
            t.addClass(‘active‘)
        }
        event.stopPropagation()
    })

//排队列表收缩
    $(document).on(‘click‘,‘body‘,function(){
        $(‘.link‘).removeClass(‘active‘)
        $(‘.queue-box‘).hide();
    })
    $(‘#queue‘).on(‘click‘,‘.queue-box‘,function(){//绑 $(‘#queue‘)或 $(document)都一样
        event.stopPropagation()

//主要是下面
            $(document).on(‘click‘,‘.btn-queue-join‘,function(){
                mywebsocket.send(JSON.stringify({
                    "action": "patientJoinQueue",
                    "patientCode": patientCode,
                    "orderCode": $(this).parents(‘.item‘).attr(‘data-id‘)
                }))
            });
//修改$(document)为$(‘.queue-box‘)就可以了
            $(‘.queue-box‘).on(‘click‘,‘.btn-queue-join‘,function(){
                mywebsocket.send(JSON.stringify({
                    "action": "patientJoinQueue",
                    "patientCode": patientCode,
                    "orderCode": $(this).parents(‘.item‘).attr(‘data-id‘)
                }))
            });

 


参考http://www.cnblogs.com/tengj/p/4794947.html对其进行了理解

暂时没空后面补理解

on事件绑定阻止冒泡的问题