C# 引导模式显示多次

我有一个使用C、Bootstrap 2.3.2和最新版本jQuery的.NET应用程序。 在我的Javascript文件中，每当用户单击按钮时，我都会向服务器发出Ajax请求，然后服务器返回包含所有信息的模式HTML：

听起来很复杂，但实际上很简单

这是CSHTML文件：

//div for the EditPackage modal
<div id="editModal"></div>

因此，当我单击上述按钮时，服务器接收到请求，并向我发送带有模式代码的HTML，然后将其放置在editModal div中，然后显示给用户

模态所需的Javascript动态加载由同一文件中的函数完成：

//http://www.javascriptkit.com/javatutors/loadjavascriptcss.shtml
function dyamicallyLoadJS(filePath) {
    var fileref = document.createElement('script');
    fileref.setAttribute("type", "text/javascript");
    fileref.setAttribute("src", filePath);
    document.getElementsByTagName("head")[0].appendChild(fileref)
}

模态本身就是简单的HTML。这很无聊：

@model AmarisGate.Model.ModalPackageInfo

@{
    ViewBag.Title = "_ModalPackageInfo";
}

<div class="modal fade" id="@Model.modalId" tabindex="-1" role="dialog" aria-labelledby="@Model.modalId" aria-hidden="true">
    <div class="modal-dialog" style="overflow-y: auto; max-height: 80vh;">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="myModalLabel">@Model.modalTitle</h4>
            </div>
            <div class="modal-body" data-val="@Model.packageId">
                <form class="form-horizontal">
                    <div class="control-group">
                        <label class="control-label">Package Name: </label>
                        <div class="controls">
                            <input type="text" class="form-control" id="package-name" placeholder="@Model.pkgNamePlaceHolder">
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">Select the Function:</label>
                        <div class="controls">
                            <input class="select2s" data-edit-values="@Model.functionsString" data-o2f-placeholder="Select Employee Function..." data-o2f-url="@Url.Action("FunctionsMultiple", "Home")" data-val="false" id="SubCategoryId" name="SubCategoryId" multiple="multiple" type="text"/>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">Select the materials:</label>
                        <div class="controls">
                            <input class="select2s" data-edit-values="@Model.materialsString" data-o2f-placeholder="Select Materials..." data-o2f-url="@Url.Action("MaterialsMultiple", "Home")" data-val="false" id="MaterialId" name="MaterialId" multiple="multiple" type="text" />
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">Company:</label>
                        <div class="controls">
                            <input class="select2s" data-edit-values="@Model.companiesString" data-o2f-placeholder="All Companies (default)" data-o2f-url="@Url.Action("CompaniesMultiple", "Home")" data-val="false" id="CompaniesId" name="CompaniesId" multiple="multiple" type="text" />
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-primary" id="@Model.saveButtonId" data-url="@Model.saveButtonUrl">@Model.saveButtonText</button>
            </div>
        </div>
    </div>
</div>

然而，我有一个问题。如果我点击按钮一次，弹出窗口就会显示一次，这很好。如果我点击两次，它会显示两次，这很烦人。如果我点击它X次，它就会出现X次，这简直太可怕了

据我所知，出现此错误是因为每次单击Edit按钮时，我都会发送并加载一个Javascript文件。然后下次单击按钮时，我将运行我得到的上一个文件，以及新文件，依此类推

我该如何解决这个问题？

---

如何防止JavaScript文件被多次运行？

该错误的解决方案：

确保MyCustom.js中的内容也没有被主页加载。简而言之，它的内容应该是唯一的，并且只适用于模态！

---

是导致回发，还是使用JQuery Get命令？请显示在editModal div中加载数据的脚本。您是否在响应中返回可能也包含modal init的脚本？添加了大量信息。我知道这个错误是什么，我知道它为什么会发生，但我不知道是否有可能修复它：S

@model AmarisGate.Model.ModalPackageInfo

@{
    ViewBag.Title = "_ModalPackageInfo";
}

<div class="modal fade" id="@Model.modalId" tabindex="-1" role="dialog" aria-labelledby="@Model.modalId" aria-hidden="true">
    <div class="modal-dialog" style="overflow-y: auto; max-height: 80vh;">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="myModalLabel">@Model.modalTitle</h4>
            </div>
            <div class="modal-body" data-val="@Model.packageId">
                <form class="form-horizontal">
                    <div class="control-group">
                        <label class="control-label">Package Name: </label>
                        <div class="controls">
                            <input type="text" class="form-control" id="package-name" placeholder="@Model.pkgNamePlaceHolder">
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">Select the Function:</label>
                        <div class="controls">
                            <input class="select2s" data-edit-values="@Model.functionsString" data-o2f-placeholder="Select Employee Function..." data-o2f-url="@Url.Action("FunctionsMultiple", "Home")" data-val="false" id="SubCategoryId" name="SubCategoryId" multiple="multiple" type="text"/>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">Select the materials:</label>
                        <div class="controls">
                            <input class="select2s" data-edit-values="@Model.materialsString" data-o2f-placeholder="Select Materials..." data-o2f-url="@Url.Action("MaterialsMultiple", "Home")" data-val="false" id="MaterialId" name="MaterialId" multiple="multiple" type="text" />
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">Company:</label>
                        <div class="controls">
                            <input class="select2s" data-edit-values="@Model.companiesString" data-o2f-placeholder="All Companies (default)" data-o2f-url="@Url.Action("CompaniesMultiple", "Home")" data-val="false" id="CompaniesId" name="CompaniesId" multiple="multiple" type="text" />
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-primary" id="@Model.saveButtonId" data-url="@Model.saveButtonUrl">@Model.saveButtonText</button>
            </div>
        </div>
    </div>
</div>