0

皆さんこんにちは！
問題があり、それを修正する方法がわかりません!

ボタンのある単純な HTML ページがあります。

<input type = "submit" value = "ok" onclick="f1()"/>

このページにはスクリプトもあります。

<script>    
function f2()    
{           
   var firstBtn = document.createElement("button");         
   firstBtn.appendChild(document.createTextNode("firstBtn"));
   document.body.appendChild(firstBtn);
   var xmlhttp = CreateRequest();
   xmlhttp.onreadystatechange=function()
   {
       if (xmlhttp.readyState==4 && xmlhttp.status==200)
       {
         var response = xmlhttp.responseText;               
         document.body.innerHTML += response;
       }
   }
   firstBtn.onclick = function()
   {
     alert("inside f2 onclick");
     xmlhttp.open("GET","test.php",true);
     xmlhttp.send();
   }

}    
function f3()  
{  
   var secondBtn = document.createElement("button");            
   secondBtn.appendChild(document.createTextNode("secondBtn"));       
   document.body.appendChild(secondBtn);
   var xmlhttp = CreateRequest();
   xmlhttp.onreadystatechange=function()
   {
       if (xmlhttp.readyState==4 && xmlhttp.status==200)
       {
         var response = xmlhttp.responseText;               
         document.body.innerHTML += response;
       }
   }
   secondBtn.onclick = function()
   {
     alert("inside f3 onclick");
     xmlhttp.open("GET","test.php",true);
     xmlhttp.send();
   }
}  
function f1()    
{  
  f2();  
  f3();  
}  
function CreateRequest()
{
    var xmlhttp;
    if (window.XMLHttpRequest)              
        xmlhttp=new XMLHttpRequest();// code for IE7+, Firefox, Chrome, Opera, Safari       
    else                    
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");// code for IE6, IE5 

    return xmlhttp;
}
</script>

そのため、ボタンの 1 つ (firstBtn または secondBtn) をクリックすると、別のボタンがクリック イベントに応答しません! 理由を知っている人はいますか？

4

1 に答える 1

0

@vishwanathが言ったように（この質問へのコメントを参照）、私がやっているとき

 document.body.innerHTML += response;

ページのすべてのコンテンツを破棄して再作成しているため、イベントが失われています。

于 2013-10-17T06:31:01.600 に答える