每次打开时重复的模态数

Question

我有一个在其中加载表单的模式。但是，每次我单击按钮打开模态时，它都会复制之前的模态数量。它以 1 开头，然后是 2、4、8、16 等等...

这是我的代码：

$('#createButton').click(function () {
    var url = $('#createModal').data('url');

    $.get(url, function (data) {
        $('#modalContent').html(data);
        $('#createModal').modal('show');
    });
});

<div id="createModal" class="modal fade" role="dialog" data-url='@Url.Action("Create")'>
    <div class="modal-dialog" id="dialog">
        <div class="modal-content" id="modalContent">

        </div>
    </div>
</div>

非常感谢您的帮助！

编辑：我在同一页面中确实有另一个模态，尽管它具有不同的 ID。如果我评论其中一个，仍然会遇到同样的问题。

<div id="editModal" class="modal fade" role="dialog">
   <div class="modal-dialog" id="dialogEdit">
      <div class="modal-content" id="modalContentEdit">

      </div>
   </div>
</div>

$(document).ready(function () {
    $(".menuActionsLink").click(function () {
        var url = $(this).data('url');

        $.get(url, function (data) {
            $('#modalContentEdit').html(data);
            $('#editModal').modal('show');
        });
    });
});

Answer 1

这应该可行，我想您可能有其中一个 ID 的重复项，也许您的代码中提到了两次 id="createModal"。孤立地看，这段代码工作正常，这表明其他地方出了问题。如果你真的很挣扎，你可以检查元素是否已经存在于 div 中，方法是做这样的事情来检查元素是否不存在。

我假设 createModal 不在 modalContent 中。如果是这样，您可以检查长度是否小于 1。如果它已经存在，那么也许您应该检查 is(':visible').

$('#createButton').click(function () {
    var url = $('#createModal').data('url');
    $.get(url, function (data) {
      if($('#modalContent #createModal').length <= 1) {
        $('#modalContent').html(data);
        $('#createModal').modal('show');
      }
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="createButton">
  Click me
</div>

Answer 2

已编辑且重要：如果我们在视图中保留 Javascript，它就完美了！！但是当我们想将 javascript 放在 javascript 文件中以便我们可以从所有视图调用相同的函数时，它就会出现该错误！！！！有谁知道为什么？？？这也意味着它与重复代码无关！

解决方案：

不要在 javascript 文件中调用函数作为点击！！！

function tentativa1() {

        var url = $('#asd').data('url');

        $.get(url, function (data) {
            $('#asd1').html(data);
            $('#asd').modal('show');
        });
};

使用上面看到的普通函数，然后在 HTML 中执行点击部分...

<button id="criarRegisto" onclick="tentativa1()">+ Create New Area</button>

我是新手，我不明白为什么会出现这种情况，但这种方式非常有效！

每次打开时重复的模态数

Number of modals duplicating each time it is opened

html

javascript

bootstrap-modal