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

Question

尝试使用以下代码将动态内容加载到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事件？

Answer 1

只有在最初将文档加载到窗口或iframe中时，才会触发$(document).ready。在您的例子中，您直接在元素中提取HTML，这甚至不会被触发。但是你不需要它，你应该能够做到：

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

Answer 2

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

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

希望能有所帮助

谢谢