Question

我正在尝试通过AJAX更新div。我正在开发基于MMORPG的在线浏览器。我使用简单的链接和href到我想要的PHP页面，但问题在于历史，它真的堆积起来...... 所以无论如何，我得出的结论是AXAJ更好。我在使用attack.php结果更新我的div时出现问题......它只打了一次。我第二次点击按钮，没有任何反应。我已经使用了Web Developer Web Console，我得到了这个

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

并且在我的indexajaxtest.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>

顺便说一下，测试帐户的登录信息是：
用户名：test
密码：1234

链接：

To log in! IMPORTANT! www.stickmaniagame.com
http://stickmaniagame.com/test/indexajaxtest.php the problem file...

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

0 个答案: