Question

我有一个模式通过另一个PHP脚本获取其内容。然后使用用户选择的ID加载内容，并使其能够编辑内容。

模态本身在一个单独的动态容器中加载到其上方。

问题在于：

第一次点击模态：触发了1个事件。

第二次：模态事件触发2次。

第三次：事件发生3次

依旧......

我尝试过没有运气的唯一ID和事件解除绑定 - 任何想法？我已经阅读了几个问题但是没有找到适合我的解决方案。

我的代码：

<script type="text/javascript">
 $('.modal-launcher'+rates_randid+'').unbind('click').click(function(e){
    //modal and modal body selection
    var modal = $('#modal_launcher'+modalid+''), modalBody = $('.modal-loader-content'+modalid+'');
    //Gets ID for the rate that needs editing.
    rateid = $(this).data('rateid');
    //on show of modal send ID and grab page/contents
    modal.on('show.bs.modal', function () {
            $.post('pages/edit_rate_modal.php?rateid='+rateid+'',{func:'edit'})
        .done(function(data){
            $('.modal-loader-content'+modalid+'').html(data);
        })
        })
    //show modal
        .modal();
    e.preventDefault();
});

$('#modal_launcher').on('hidden.bs.modal', function (e) {
    $('.modal-loader-content').empty();
})
</script>

Answer 1

您可以使用jQuery one()仅绑定模态show事件一次：

modal.one('show.bs.modal', function () {
    $.post('pages/edit_rate_modal.php?rateid=' + rateid, {
        func: 'edit'
    })
        .done(function (data) {
        $('.modal-loader-content' + modalid).html(data);
    })
})
//show modal
.modal();

但最好的办法是不在Click处理程序中嵌套此事件。

Javascript不止一次触发事件

1 个答案: