Question

我已经集成了一个引导程序模式，并包含一个.js文件。 js文件的内容如下。 .js文件用于调用Ajax。当我按下“加载更多”按钮时，它会触发ajax函数一次，这很好。但是，一旦我关闭了模态并再次打开它，然后单击“加载更多”按钮，它将触发ajax函数两次。如果我关闭模态并再次打开它，然后单击“加载更多”按钮，则ajax函数将触发三次。我的问题是：如果单击“加载更多”按钮，如何仅加载ajax函数一次？该方案应为：

我点击了更多负载，然后调用了ajax。
我关闭了模态，然后再次打开它。我单击了“加载更多”按钮和ajax fire（仅一次）。如果我再次单击加载更多按钮，它将再次调用ajax函数。

以此类推。

$(document).ready(function(){
   $(document).on('click','#btn-more',function(){
       var id = $(this).data('id');
       var token_csrf = $("#csrfToken").val();
       var base_path_loadata = $("input[name='base_path_loadata']").val(); 
       $("#btn-more").html("Loading....");
       $.ajax({
           url : base_path_loadata,
           method : "POST",
           data : {id:id, _token:token_csrf},
           dataType : "text",
           success : function (data)
           {
              if(data != '') 
              {
                  $('#remove-row').remove();
                  $('#load-data').append(data);
              }
              else
              {
                  $('#btn-more').html("No Data");
              }
           }
       });
   });  
});

<div id="remove-row">
                <button id="btn-more" data-id="{{$lastId}}" class="nounderline btn-block mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" ><span class="Cicon" ><i class="fa fa-paper-plane"></i></span> Load More </button>
            </div>

Answer 1

当前，每次打开模式（并加载脚本）时，都会添加一个事件处理程序。使用off('click')删除以前的事件处理程序：

$(document).off('click','#btn-more').on('click','#btn-more', function...)

jQuery Ajax在关闭模式后多次加载

1 个答案: