Fatal编程技术网
  • javascript/
  • Javascript 在div中更新AJAX结果（召回）

Javascript 在div中更新AJAX结果（召回）

javascript html ajax

Javascript 在div中更新AJAX结果（召回）,javascript,html,ajax,Javascript,Html,Ajax,我正在尝试通过AJAX更新一个div。我正在开发基于在线浏览器的MMORPG。我使用简单的链接和href指向我想要的PHP页面，但问题在于历史，它真的在堆积。。。 所以不管怎样，我得出的结论是AXAJ更好。 我在用attack.php结果更新div时遇到问题。。。它只会战斗一次。我第二次点击按钮，什么也没发生。 我使用了WebDeveloperWeb控制台，我得到了这个 [14:47:51.167]TypeError:document.getElementById（…）为null@stickma

我正在尝试通过AJAX更新一个div。我正在开发基于在线浏览器的MMORPG。我使用简单的链接和href指向我想要的PHP页面，但问题在于历史，它真的在堆积。。。 所以不管怎样，我得出的结论是AXAJ更好。 我在用attack.php结果更新div时遇到问题。。。它只会战斗一次。我第二次点击按钮，什么也没发生。 我使用了WebDeveloperWeb控制台，我得到了这个

[14:47:51.167]TypeError:document.getElementById（…）为null@stickmaniagame.com/test/indexajaxtest.php:40

在我的indexaxtest.php中，第40行是

    document.getElementById("gif").style.visibility="visible";
第一次单击时，我没有问题，但是第二次，我得到这个错误，什么也没有发生

这是我的密码：

<!DOCTYPE html>
<html>
<head>
<?  include('includes/config.php');
?>
<script type="text/javascript">
var creatureId;
var i;
function attack(creatureId)
{
    document.getElementById("gif").style.visibility="";
    document.getElementById("gif").src="images/anim.gif";
    document.getElementById("attackbtn").style.visibility="hidden";
    setTimeout(function(){myTimer(creatureId)},2000);
}

function myTimer(creatureId)
{
    var x=document.getElementById("mySelect");
    var xmlhttp;
    document.getElementById("gif").style.visibility="hidden";
    document.getElementById("img").innerHTML="";
    document.getElementById("attackbtn").style.visibility="";

    if (window.XMLHttpRequest)
      {xmlhttp=new XMLHttpRequest(); }
    else
      {xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}

    xmlhttp.onreadystatechange=function()
      {  if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("battle").innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("GET","attack.php?creature="+creatureId,true);
    xmlhttp.send();
}

function attack2()
{
    document.getElementById("gif").style.visibility="visible";
    document.getElementById("gif").src="images/anim.gif";
    document.getElementById("attackbtn").style.visibility="hidden";
    setTimeout(function(){battle()},2000);
}

function battle()
{
    var x=document.getElementById("mySelect");
    var xmlhttp;
    document.getElementById("gif").style.visibility="hidden";
    document.getElementById("img").innerHTML="";
    document.getElementById("attackbtn").style.visibility="";

    if (window.XMLHttpRequest)
      {xmlhttp=new XMLHttpRequest(); }
    else
      {xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}

    xmlhttp.onreadystatechange=function()
      {  if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("battle").innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("GET","click.html",true);
    xmlhttp.send();
}
function reply_click(clicked_id)
{
    creatureId=clicked_id;
    myTimer(creatureId);
}
</script>
</head>
<body>

<h1>Attack</h1>
<div id="img"><img id="gif" style="visibility:hidden"></div>
<div id="battle" style="visibility:visible;"></div>
<input id="attackbtn" name="attackbtn" type="image" src="/test/images/attack.jpg" value="Attack" onclick="attack2()" />
<form>
<div onClick="if(document.getElementById('creatures').style.visibility=='visible')
                {document.getElementById('creatures').style.visibility='hidden';}
                else{document.getElementById('creatures').style.visibility='visible';}">
Creatures:
</div>
<div id="creatures" style="visibility:collapse;">
  <?
  $creatures = mysql_query("SELECT id, name FROM creatures ORDER BY level DESC limit 5");
while($row = mysql_fetch_array($creatures))
  {
      ?>
  <div id="<? echo $row['id']; ?>" style="margin-left:100px;" onClick="reply_click(this.id);">
  <img src="images/monster.jpg" height="30px" /><? echo $row['name']; ?>
</div>
<? } ?>
</div>
<input type="button" onclick="attack2()" value="Alert index of selected option">
</form>
</body>
</html> 


类生物变种；
var i；
函数攻击（creatureId）
{
document.getElementById（“gif”）.style.visibility=“”；
document.getElementById（“gif”）.src=“images/anim.gif”；
document.getElementById（“attackbtn”）.style.visibility=“hidden”；
setTimeout（function（）{myTimer（creatureId）}，2000）；
}
函数myTimer（creatureId）
{
var x=document.getElementById（“mySelect”）；
var-xmlhttp；
document.getElementById（“gif”）.style.visibility=“hidden”；
document.getElementById（“img”）.innerHTML=“”；
document.getElementById（“attackbtn”）.style.visibility=“”；
if（window.XMLHttpRequest）
{xmlhttp=new XMLHttpRequest（）；}
其他的
{xmlhttp=newActiveXObject（“Microsoft.xmlhttp”）；}
xmlhttp.onreadystatechange=函数（）
{if（xmlhttp.readyState==4&&xmlhttp.status==200）
{
document.getElementById（“battle”）.innerHTML=xmlhttp.responseText；
}
}
open（“GET”、“attack.php？bioture=“+creatureId，true”）；
xmlhttp.send（）；
}
函数攻击2（）
{
document.getElementById（“gif”）.style.visibility=“可见”；
document.getElementById（“gif”）.src=“images/anim.gif”；
document.getElementById（“attackbtn”）.style.visibility=“hidden”；
setTimeout（function（）{battle（）}，2000）；
}
函数战（）
{
var x=document.getElementById（“mySelect”）；
var-xmlhttp；
document.getElementById（“gif”）.style.visibility=“hidden”；
document.getElementById（“img”）.innerHTML=“”；
document.getElementById（“attackbtn”）.style.visibility=“”；
if（window.XMLHttpRequest）
{xmlhttp=new XMLHttpRequest（）；}
其他的
{xmlhttp=newActiveXObject（“Microsoft.xmlhttp”）；}
xmlhttp.onreadystatechange=函数（）
{if（xmlhttp.readyState==4&&xmlhttp.status==200）
{
document.getElementById（“battle”）.innerHTML=xmlhttp.responseText；
}
}
open（“GET”，“click.html”，true）；
xmlhttp.send（）；
}
功能回复\u点击（点击\u id）
{
creatureId=单击的\u id；
myTimer（creatureId）；
}
袭击
生物：
顺便说一句，测试帐户的登录信息是：
用户名：test
密码：1234

链接：


我建议不要从头开始做Ajax。陷阱很多。有一个像jQuery这样的东西存在的原因：）我只使用了“简单”的开发，我才16岁。。。哈哈。。。但我会试着了解你的意思，虽然我不太明白。。。