javascript - Bootstrap 模式不会从包含 AJAX 调用创建的内容的模式中显示

Question

我正在开发一个 Web 应用程序，该应用程序通过单击图标打开显示用户联系人的 Bootstrap 模式。此模式中的数据是通过 AJAX 调用创建的。动态数据包含一个 anchor 标记，单击该标记时应打开第二个模式，该模式将允许用户编辑联系信息。第一个模态中的标签如下所示:

    <a href="#" class="text-gray edit-contact" data-toggle="modal" data-target="#edit-contact">Edit</a></div><div class="clearfix"></div></div>';     

该页面包含一个 id="edit-contact"的对话框模式

在动态生成时，单击此链接不会执行任何操作，但如果在页面中对其进行硬编码，则第二个模式将按预期打开。此外，诸如单击之类的事件不适用于动态生成的内容。

在同一页面上，我可以从 AJAX 数据打开模式，但打开模式的链接位于页面上而不是另一个模式上，因此 Bootstrap 模式似乎存在动态内容问题 -有人遇到这个问题吗？ -谢谢!

Answer 1

您需要在ajax成功中调用模式的打开:

$.ajax("myUrl").success(function(data)
{
  $('#edit-contact').append(data).modal('show');
});

<小时/>

<div id="edit-contact" class="modal fade" role="dialog" aria-labelledby="modalTitle" aria-hidden="true"></div>