如何防止在 jQuery 中多次加载文件

Question

可能我这个线程的主题与 Whosebug 上的多个线程相同，但请相信我，我已经阅读了这个平台上的所有线程以及 google 但我没有得到预期的答案我的问题如下- 当我第一次单击按钮时，模态 div 正确加载 URL 但是在关闭模态 div 并点击按钮再次打开它加载两次。表示在每个按钮上单击模态负载 URL 是之前负载 URL 的两倍。假设如果这次 LOAD URL 下次加载 2 次它的加载 4 次等等..

甚至，我用了return false，但我没有得到答案，我也阅读了其他线程的答案，但它与我的问题代码不匹配。

注意：我是 Whosebug 政策的规则，在阅读所有线程后不创建此线程并且没有得到答案，请不要标记此重复/待处理和任何负面标记。我的代码哪里做错了我是这个调试的新手。

$('#reveal_AddSenderMod').on('click', function() {
  $('.modal.fade.modal-style2').on('shown.bs.modal', function() {
    $(this).find('.modal-body').find('#loadURL').load('./loadPage.html').fadeIn('slow');
    return false;
  });
})

<link rel="stylesheet" href="http://shashani-humanth.github.io/Notebook-AdminPanel/css/bootstrap.css" type="text/css" />

<button type="button" id="reveal_AddSenderMod" data-toggle="modal" data-target="#modal-style2" style="width:75px; display: block;margin: 0 auto;" data-keyboard="false" data-backdrop="static">OPEN MODEL</button>

<div class="modal fade modal-style2 hidden-print" id="modal-style2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header"></div>
      <div class="modal-body">
        <div class="row">
          <div id="loadURL" class="animated fadeIn"></div>
          <button data-dismiss="modal">CLOSE MODEL</button>
        </div>
      </div>
    </div>
  </div>
</div>
<script>
 $(document).on("click", "button[data-dismiss='modal']", function(e){
  e.preventDefault();
  $('div.modal-body').find('div#loadURL').find('div.senderIDAdd_module').empty(); //remove() is also not works
 });
 </script>
<script src="http://shashani-humanth.github.io/Notebook-AdminPanel/js/jquery.min.js"></script>
<!-- Bootstrap -->
<script src="http://shashani-humanth.github.io/Notebook-AdminPanel/js/bootstrap.js"></script>

Answer 1

您多次绑定事件。

点击后，您应该只打开模式。不绑定。绑定应该完成一次。

$('#reveal_AddSenderMod').on('click', function() {
  $('.modal.fade.modal-style2').modal('show');
})

$('.modal.fade.modal-style2').on('shown.bs.modal', function() {
    $(this).find('.modal-body').find('#loadURL').load('./loadPage.html').fadeIn('slow');
    return false;
  });

//一些伪代码

$('body').on('click', '#on-submit-senderid', function() {
        if(localStorage.getItem("review_submitte")) {
          return;
        }
        if(!$('input[name="sender_id_confirm"]').is(':checked')) {
            mkNoti(['Ops!'],['Please agree the condition to get Custom Sender ID'],{ sound: true, status:['danger'],dismissable: false });
            return;
        } else {
            $.ajax({
                            ...
                success: function(response) {
                    if (response.status == 'success') {
                        //SUCCESS
                        return false;
                    } else {
                        mkNoti([response.title],[response.message],{ sound: true, status:[response.status],dismissable: false });
                        return false;
                    }
                    localStorage.setItem("review_submitte", "true")
                }
            });
            hide_loader();
            return false;
        }
    });

如何防止在 jQuery 中多次加载文件

How to prevent load file multiple times in jQuery

html

javascript

jquery

load

modal-dialog