Question

大家好！
我有一个问题，我不知道如何解决它！

我有一个带按钮的简单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>

现在，当我单击其中一个按钮（firstBtn或secondBtn）时，另一个按钮没有响应click事件！有人知道为什么吗？

Answer 1

正如@vishwanath所说（见这个问题的评论），当我做

时

 document.body.innerHTML += response;

我正在摧毁并重新创建我页面的所有内容，因此我正在失去我的活动。

JS活动。只调用了一个事件处理函数？

1 个答案: