Question

我有一个主页面，我正在加载模态对话框，这些对话框在其他部分html页面中存储为HTML。我在不同按钮点击的页面中动态加载模态为1模态。

我的模态的部分页面如下所示：1页：

<script type="text/javascript" src="../App/modals.js"></script>

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
    <h4 class="modal-title" id="myModalLabel">Specify entity name you wish to create</h4>
</div>
<div class="modal-body">
    <div class="row">
        <form>
            <div class="col-md-6">
                <input type="text" id="txtEntityNameCreate" />
            </div>
            <p class="modal-log"></p>
        </form>
    </div>
</div>
<div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-primary" onclick="AddEntity()">Create Entity</button>
</div>

我在顶部引用了一个脚本，该脚本负责重置对话框中的文本字段。我也可以将它用于以后的目的。但是当我从主页面调用这样的对话框时，脚本没有加载到页面中：

<a  id="" data-toggle="modal" data-target="#mainModal" 
   href="modals/createmodal.html"
   data-remote="modals/createmodal.html" 
   onclick="Utilities.SetFocusModal('txtEntityNameCreate')">
    <img src="../Images/create.png" />
    <h4>Create Entity</h4>
</a>

如何在加载对话框时加载modals.js？

感谢。

Answer 1

当远程加载bootstraps模式时，它们不会重新加载dom，因此页面没有被重新加载到刚刚插入html的模式中，所以你的脚本很可能没有执行，不能确定你的脚本是什么样的但这很可能是问题所在。 Bootstrap有一个jquery函数，用于显示模态。因此，如果您的脚本在正常加载html时正常运行，例如只打开您的代码段，那么您可以在主页上执行以下操作：

$('#mainModal').on('shown.bs.modal', function () {
  //then put your script here
});

或者

$('#mainModal').on('shown.bs.modal', function () {
  $.getScript('path/to/script.js');
});

然后在显示#mainModal时执行脚本。

HTML中的JavaScript引用未加载到模态中

1 个答案: