当绑定两个.on“click”函数时,一个覆盖另一个

时间:2013-08-20 21:31:41

标签: jquery

点击后这两个链接:

 <a href="/modals.cfm?action=record_payment&amp;script=%2Fmanager%5Fpro%2Ecfm%2Fleague%2F268%2Faction%2Fregistration%2Fcontent%5Faction%2Fmanagedues%2Ftabindex%2F3&amp;player_id=41363&amp;dues_id=199&amp;league=268&amp;f_division_id=1014&amp;price2pay=10" class="btn btn-mini facebox ttLT btn-success" alt="Record Manual Payment for ashley wilkes" data-hasqtip="329" oldtitle="">Record Payment</a>

<a href="/manager_pro.cfm/league/268/action/registration/content_action/managedues/tabindex/3/m0dal_update/manageleague/submethod/manageusersdrop_members/player_id/40454" class="btn btn-mini btn-danger" data-confirm="Are you sure you want to drop this member?">Drop Player</a>

触发这些功能:

    $(document).on("click", "a[data-confirm]", function(event){
    var href = $(this).attr('href');
    if (!$('#dataConfirmModal').length) {
        $('body').append('<div id="dataConfirmModal" class="modal" role="dialog" aria-labelledby="dataConfirmLabel" aria-hidden="true"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button><h3 id="dataConfirmLabel">Please Confirm</h3></div><div class="modal-body"></div><div class="modal-footer"><button class="btn btn-info" data-dismiss="modal" aria-hidden="true">Cancel</button><a class="btn btn-warning" id="dataConfirmOK">I wish to continue</a></div></div>');
    } 
    $('#dataConfirmModal').find('.modal-body').text($(this).attr('data-confirm'));
    $('#dataConfirmOK').attr('href', href);
    $('#dataConfirmModal').modal({show:true});
    event.preventDefault();
}); 

$(document).on("click", ".facebox", function(event){
    var $link = $(this);
    if ($(".modal").dialog( "isOpen" )===true) {
        event.preventDefault();
    } else {
        new BootstrapDialog({
            title   :   '<h3>' + $link.attr('alt') + '</h3>',
            content :   $('<div>Loading...</div>').load($link.attr('href')),
            buttons :   [
                {
                    label   :   'Cancel',
                    onclick :   function(dialog){dialog.close();}
                }
            ]
        }).open();      
        event.preventDefault();
    }       
}); 

每个单独工作,但只要我点击一个,另一个就会打开全屏链接。好像一个人正在覆盖或否定另一方的约束力。

有没有办法防止这种情况发生?

1 个答案:

答案 0 :(得分:0)

我认为您可能希望将preventDefault移动到处理函数的开头。

这很好用:

FIDDLE ME