getImageData点击动态按钮时

我已经创建了两个带有javascript的动态按钮。当我点击它们时，我希望它们从sample.js中获得ImageIdata和getImage2Data。由于这些按钮是动态创建的，我不确定如何去做这件事。我正在提供html代码以及sample.js文件。getImageData点击动态按钮时

HTML

<!DOCTYPE html> 
    <html> 
    <head> 
    <style type="text/css"> 


    .btn { 
    font-family  : Arial; 
    text-align  : center; 
    width   : 100px; 
    height   : 15px; 
    background  : #ccc; 
    border   : 1px solid #000; 
    box-shadow  : 1px 1px 5px -1px #000; 
    padding   : 10px; 
    margin-bottom : 10px; 
    cursor   : pointer; 
    } 

    .btn:hover { 
     text-decoration : underline; 
    } 

    </style> 

    </head> 
    <body> 


    <script language="javascript"> 
     var button = 'btn1,btn2'.split(','); 
    for (var b in button) { 
     var newElement = document.createElement('div'); 
     newElement.id = button[b]; newElement.className = "btn"; 
     newElement.innerHTML = button[b]; 
     document.body.appendChild(newElement); 
    } 

    </script> 

    </body> 
    </html> 

/***********************************/ 
/***********************************/ 

SAMPLE.js 

    var image2Src = null; 

    function getImage1Data(){  
     var image1Src;  
     var xhttp = new XMLHttpRequest(); 
     xhttp.open("Get", 'some Url', false);  
     xhttp.send(null);  
     image1Src = xmlhttp.responseText; //Assume src = 'myFirstImg.png', 
     200x200 px 
    } 


    function getImage2Data(){  

     var xhttp = new XMLHttpRequest();  
     xhttp.onreadystatechange = function(){   
      if(xmlhttp.readyState == 4 && xmlhttp.status == 
    200)      
      getSrc(xmlhttp.responseText);  
    }   

      xhttp.open("Get", 'some Url', true);   
      xhttp.send(null); 
    } 

    function getSrc(text){  
     image2Src = text; //Assume src = 'myLastImg.png', 10x10 px 
    }

来源

2016-04-08 McClain

的按钮是动态创建的（即后的for循环）后，可以onClick事件分配给这些按钮的元件。

document.getElementById("btn1").onclick = getImage1Data; 
document.getElementById("btn2").onclick = getImage2Data;

当点击id为BTN1按钮元素，它会调用getImage1Data功能和点击ID为BTN2按钮，功能getImage2Data被调用。请记住在您的按钮创建代码上方的HTML页面中包含sample.js。

来源

2016-04-08 17:37:47

getImageData点击动态按钮时

回答

相关问题