Javascript 如何停止div加载HTML页面

通过单击另一个外部按钮调用idmain上的

remove（）

。问题是，如果用户单击

btn1

并快速按下该外部按钮，则会在

btn1

的事件处理程序之前调用remove。因此，在删除div后将加载弹出窗口。单击remove的事件处理程序时，是否有停止加载请求的方法？调用remove方法时，我尝试了使用

jqXHR.abort（）

，但这不起作用，因为在发送ajax之前就调用了remove

有许多像btn1这样的按钮，它们将发送ajax请求以加载HTML，而一些HTMlL文件，例如

a.HTML

将加载一些脚本文件，如

a.js

，这些脚本文件将被执行。如果脚本引用了在

remove（）

中删除的某个变量，则会出现类型错误

<div id="base">
    <div id="main">
        <!-- some more HTML elements -->
        <button id="btn1"></button>
    </div>
    <div id ="popup">
    </div>
</div>

<script>  
    var xhr;      
    $("#btn1").on("click", function(){
        xhr = $.ajax(
        url: "a.html",
        success: function(){
             //do something
        }),
        type: "GET"
    });

    $("#main").on("remove", function(){
       // delete all resources,etc.
       xhr.abort();
    });
</script>

var-xhr；
$（“#btn1”）。在（“单击”，函数（）{
xhr=$.ajax(
网址：“a.html”，
成功：函数（）{
//做点什么
}),
键入：“获取”
});
$（“#main”）。在（“remove”，function（）上{
//删除所有资源等。
xhr.abort（）；
});

尝试使用全局变量

var removed = 0;
$('externabutton').click(function(){
  $("#main").remove();
   removed = 1;
});
 $("#btn1").on("click", function(){
        xhr = $.ajax(
        url: "a.html",
        success: function(data){
             if (removed == 0 ) {
              //append the data
             } else {removed ==0;}
        }),
        type: "GET"
    });

---

由于

xhr

是异步的，因此我们不能保证

xhr

在

#main.remove

方法之前完成。也许你可以用一个旗子来控制它

var isRemoved = false, xhr;
$("#btn1").on("click", function(){
    if(isRemoved) return;
    xhr = $.ajax({
      url: "a.html",
      success: function(){
           //do something
        if(isRemoved) return;
      },
      type: "GET"
   });
 });

$("#main").on("remove", function(){
   isRemoved = true;
   xhr && xhr.abort();
});

---

为什么不禁用btn1单击上的外部按钮，并在ajax方法的“完成”回调中启用它？我编辑了这个问题，以提供有关该问题的更多信息。全局变量

removed

将允许不将数据附加到HTML，但仍将加载脚本。什么脚本，如何加载？

$.getScript（“a.js”）

。这与ajax有什么关系\