需要加载javascript库还是等待它加载？

当用户单击按钮时，我加载javascript库：

if (mylib.myfunction) {
    mylib.myfunction();
} else {
    var jsElt = document.createElement("script");
    body.head.appendChild(jsElt);
    jsElt.onload = function() { mylib.myfunction(); }
    jsElt.src = MYLIB_URL;
}

当然，这是可行的，但有一个问题：如果用户在onload事件之前再次单击，那么else部分将再次执行。避免这种情况的最佳方法是什么？局部变量？还有别的吗

更新：我要感谢@Suman Bogati和@usernid建议禁用单击的按钮。但是，该解决方案对我来说太有限了，因为它假定您可以从加载新库的代码访问该按钮。当然，情况并非总是如此

在我的情况下，我不能使用这个解决方案，所以我将使用一个全局变量。如果没有人有更好的主意

试试看

从脚本中禁用按钮

document.getElementById("btnId").disabled = true; 

document.getElementById("btnId").disabled = false; 

从脚本中启用按钮

document.getElementById("btnId").disabled = true; 

document.getElementById("btnId").disabled = false; 

在你的代码中

function methodName()
{

  document.getElementById("btnId").disabled = true; 
  if (mylib.myfunction) {
      mylib.myfunction();
      document.getElementById("btnId").disabled = false; 
  } else {
      var jsElt = document.createElement("script");
      body.head.appendChild(jsElt);
      jsElt.onload = function() { mylib.myfunction(); }
      jsElt.src = MYLIB_URL;
      document.getElementById("btnId").disabled = false; 
  }
}

html

在加载脚本之前禁用该按钮，如下所示

Load js
函数loadJavascript（）{
var myButton=document.getElementById（'myButton'）；
myButton.disabled=true；
var jsElt=document.createElement（“脚本”）；
文件头附件（jsElt）；
jsElt.onload=函数（）{
myButton.disabled=false；
//mylib.myfunction（）；在此处调用函数
}
//这里是您的src for js文件，这只是测试目的
jsElt.src=”http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js";
}

这可能有效，我还没有测试：

if (mylib.myfunction) {
    mylib.myfunction();
} 
else {
   if (!document.getElementById("scriptTag") ) {
      var jsElt = document.createElement("script");
      jsElt.onload = function() { mylib.myfunction(); }
      jsElt.setAttribute("id", "scriptTag");       }
      jsElt.setAttribute("src", MYLIB_URL);
      body.head.appendChild(jsElt);
}

---

在加载

脚本之前禁用该按钮，如果您在加载后仅pur src，则该按钮将起作用。（但脚本上的id是非标准的。）嘿，哇，酷！谢谢你的更新。脚本标记中的id似乎是ok：而我错了。“id”在HTML5中是一个“全局属性”，允许在所有元素上使用：这是一个比全局变量路由更干净的解决方案。如果这回答了你的问题，就接受它，这样它就进入了“已回答”的范围。是的，@Brian，它工作得很好。在发布这个问题之前，我想知道这是否是最好的方法，但因为我现在意识到“id”是一个全局属性，它似乎是最简单和最好的方法。您可以将“onerror”添加到此解决方案中，但我并没有对此进行太多研究。如果您想要更好的错误处理（实际上我不确定我是否需要它），那么XMLHttpRequest可能会更好。它有时很有用，但不适合我的问题。