javascript - 如何防止在不使用超时的情况下同时运行多个 .change 函数

Question

我仍在学习 JS，所以请原谅我的“js”语言和解释。我有一个从控制器获取数组并使用 .change 函数将其传递给 view.html 的系统。根据控制器中加载的数据，信息加载需要时间，因此加载数据的时间不同。

然后使用下面的代码通过 iframe 将数据加载到视图中。我注意到，当用户输入输入以加载更多数据而之前的数据仍在加载时，它也会开始运行该函数，而无需等待第一个完成。我想阻止下一个函数运行，直到第一个函数完成。

<input id='Input' type="submit" name="message" ask="" >                                      
<input id='Input' class='Input' type="submit" name="message" ask="<iframe class='responsive-iframe' onLoad='IframeLoad();' ></iframe>" answer="true">

<input id='Input1' type="submit" name="message" ask="" >
                                        
<input id='Input1' class='Input1' type="submit" name="message" ask="<iframe class='responsive-iframe' onLoad='IframeLoad();' ></iframe>" answer="true">

<input id='Input2' type="submit" name="message" ask="" >
                                        
<input id='Input2' class='Input2' type="submit" name="message" ask="<iframe class='responsive-iframe' onLoad='IframeLoad();' ></iframe>" answer="true">


$(document).ready(function(){
var arr = [];//From controller, can be variable in size

$('#Input').change(function(){  
    arr.push($(this).val());
    var arrayJSON = JSON.stringify(arr);
    localStorage.setItem("TheData",arrayJSON);     
});

$('#Input1').change(function(){  
    arr.push($(this).val());
    var arrayJSON = JSON.stringify(arr);
    localStorage.setItem("TheData",arrayJSON);       
});    


$('#Input2').change(function(){  
    arr.push($(this).val());
    var arrayJSON = JSON.stringify(arr);
    //sessionStorage.setItem("TheData",arrayJSON);
    localStorage.setItem("TheData",arrayJSON);  
});

});

标签： javascript