javascript - DIVs点击事件错误触发其他DIVs点击事件

Question

<分区>

Answer 1

我建议在所有这些类上放置一个(即class="showModalOnClick")“编辑”——可能会改变它以适应更好地满足您的需求。

然后，使用单个绑定(bind)事件:

    // bind to document instead of directly to the class in case you have 
    // some of the items to click being added after the document is loaded.
    $(document).on('click','.edit',function(){
        var $this = $(this);
        var e = $this.attr('id');
        var id = $this.data('target');

        // This console.log outputs the e and id of the very last div.
        // I click #e800 and the output for this is :
        // "Click event of #e805 now showing #event805"
        console.log("Click event of " + e + " now showing " + id);
        $(id).show();
        $('#backdrop').show();

        // $(id) element is a child of the $(e) element.
        // If we do not call ev.stopPropagation() then
        // the click will also be triggered in $(e).
        // This would cause the modal to reshow directly
        // after being hidden.
        // Which means once clicked, it would never hide.
        // .one will run this event once and unbind after
        $(id).one('click', function(ev) {
            ev.stopPropagation();
            $(id).hide();
            $('#backdrop').hide();
        });
    });