jQuery事件未在加载的Bootstrap模式窗口中绑定

jQuery events are not bind in loaded Bootstrap modal window

本文关键字：模式 窗口 绑定 Bootstrap 事件 加载 jQuery      更新时间：2023-09-26

尝试用以下代码将动态内容加载到Bootstrap模态中：

$('body').on('click', '.time-estimation', function () {
    var taskId = $(this).data("task_id");
    $("#modal-content").load("/tasks/estimation?task_id=" + taskId, function () {
        $('#myModal').modal({show: true, keyboard: true, backdrop: true});
    });
});

它工作，并显示模式窗口。但在加载的内容中还有另一个jQuery代码，它没有绑定：

 $(document).ready(function () {
     $("#TaskEstimationTimeForm").submit(function (event) {
         event.preventDefault();
    });
});

为什么不触发此submit事件？

$(document).ready仅在文档最初加载到窗口或iframe中时触发。在您的情况下，您直接在元素中提取HTML，这甚至不会被激发。虽然你不需要它，但你应该能够做到：

$("#TaskEstimationTimeForm").submit(function(event) {
    event.preventDefault();
});

你可以这样做，因为它对我有效

$('#myModal').modal({show: true, keyboard: true, backdrop: true})
.one('submit','#TaskEstimationTimeForm',function(){
  //your stuff on event here
})

希望它能帮助

感谢

相关文章：