var emps;
function GetEmps(){
const Http = new XMLHttpRequest();
const url='http://127.0.0.1:3001/GetEmployeeList';
Http.open("GET", url);
Http.send();
Http.onreadystatechange = (e) => {
e.preventDefault();
if(Http.responseText.length>0)
{
emps=JSON.parse(Http.responseText);
for(let i=0;i<emps.length;i++)
{
CreateElementsInPage(i);
}
}
}
}
function CreateElementsInPage(id) {
console.log(id);
var btn = document.createElement("BUTTON");
btn.innerHTML = emps[id].name;
document.body.appendChild(btn);
var newLine=document.createElement("br");
document.body.appendChild(newLine);
}
GetEmps();
我正在尝试动态创建按钮。对于 emps 数组中的每个项目,我希望在 DOM 中出现一个按钮,但是“CreateElementsInPage”函数被调用 4 次而不是 2 次(假设我在 emps 中有 2 个项目),并且我得到 4 个按钮
最佳答案
您应该在回调中检查请求状态:
Http.onreadystatechange = (e) => {
if(Http.readyState === XMLHttpRequest.DONE ) {
// Request is complete, do your logic
}
}
关于javascript - Js中阻止函数多次运行的最佳方法是什么,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58942945/