如何在onclick按鈕中包含.js文件？

Question

我試圖讓一個按鈕，將運行JavaScript時，它是clicked.First，我的劇本是這樣

<script> 
    function myFunction() 
    { 
     alert('Invalid username or password. Please try again.') 
    } 
</script> 

<input onclick="myFunction()" type="submit" value="Generate" href="submit.php" > 

它的工作原理，然後彈出的appear.But當我嘗試從另一個調用JavaScript網站，沒有任何反應。

<script> 
    function myFunction() 
    {    
     document.body.appendChild(document.createElement('script')).src='https://raw2.github.com/BlackEagleBCC/Script/master/myscript.js'; 
    } 
</script> 

<input onclick="myFunction()" type="submit" value="Generate" href="submit.php" > 

Answer 1

一旦發生事件，您需要包含js文件。

請參閱此link，它演示動態包括js和css。

添加HTML代碼

<ul> 
<li><a href="javascript:loadjscssfile('myscript.js','js')">Load "myscript.js"</a></li> 
<li><a href="javascript:loadjscssfile('mystyle.css','css')">Load "mystyle.css"</a></li> 
</ul> 

然後js代碼

function loadjscssfile(filename, filetype){ 
if (filetype=="js"){ //if filename is a external JavaScript file 
    var fileref=document.createElement('script') 
    fileref.setAttribute("type","text/javascript") 
    fileref.setAttribute("src", filename) 
} 
else if (filetype=="css"){ //if filename is an external CSS file 
    var fileref=document.createElement("link") 
    fileref.setAttribute("rel", "stylesheet") 
    fileref.setAttribute("type", "text/css") 
    fileref.setAttribute("href", filename) 
} 
if (typeof fileref!="undefined") 
    document.getElementsByTagName("head")[0].appendChild(fileref) 
} 

代碼myscript.js

var petname="Spotty" 
alert("Pet Name: " + petname) 

代碼mystyle.css

#ul li{ 
background-color: lightyellow; 
} 

與此類似：

你可以叫你loadjscssfile按鈕的onclick（）事件處理中（ 'myscript.js'， 'JS'）。

Answer 2

更新： 嘗試了這一點：

<a id='myScript' type="submit" href="submit.php" > Generate </a> 

腳本：

<script type="text/javascript"> 
    var myScript = document.getElementById('myScript'); 

    myScript.onclick = function(){ 

     var script = document.createElement("script"); 
     script.type = "text/javascript"; 
     script.src = "https://raw2.github.com/BlackEagleBCC/Script/master/myscript.js"; 
     document.getElementsByTagName("head")[0].appendChild(script); 
     return false; 
    } 
</script> 

EDITED：以下解決方案可能不是你所期待的吧。

我一直在使用這個，我從stackoverflow本身找到的解決方案。

function loadScripts(array,callback){ 
    var loader = function(src,handler){ 
     var script = document.createElement("script"); 
     script.src = src; 
     script.onload = script.onreadystatechange = function(){ 
     script.onreadystatechange = script.onload = null; 
      handler(); 
     } 
     var head = document.getElementsByTagName("head")[0]; 
     (head || document.body).appendChild(script); 
    }; 
    (function(){ 
     if(array.length!=0){ 
      loader(array.shift(),arguments.callee); 
     }else{ 
      callback && callback(); 
     } 
    })(); 
} 

這將幫助您創建腳本標記。

loadScripts([ 
    "http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js", 
    "https://raw2.github.com/BlackEagleBCC/Script/master/myscript.js" 
],function(){ 
    alert('Scripts have been loaded successfully'); 
}); 

編輯： 當我需要構建腳本標籤和得到的一切加載罰款後的回調我已經使用這個方法。 （這些東西來方便:)） https://stackoverflow.com/a/1867135/3222041