HTML按钮显示文本而不会中断脚本

时间:2013-09-07 19:26:21

标签: javascript html text-based

好的,所以我是HTML / javascript的新手,但是我正在研究一个基于文本的游戏项目,基本上,我想要一个函数,它需要一个文本数组,打印文本区域中的第一个,并等到按下“确定”按钮,然后打印数组的下一个字符串。此函数位于一堆其他字符串的中间。 这是我目前的代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Retro-Fighting</title>
</head>

<body>

<br><br><br>

<input id="hpPlayer" type="text" value="" size="40" readonly>
<input id="hpBoss" type="text" value="" size="40" readonly>


<div id="sound_element"></div>
<script>
var player={
    //Bunch of characteristics
};
var boss={
  //Bunch of characteristics

};

var playerTurn=function()
{

 var action =prompt("Do you want to : ATTACK , use MAGIC , or drink a POTION?").toLowerCase();

 switch(action)
 {
   case 'attack':
       var rand=10+(player.luck-50)-Math.floor(Math.random() *20  + 1);
        var damage= Math.floor(player.attack+rand-(boss.defense/2));
        alert("You hit "+boss.name+" and deal "+damage+" damage points!" );
        boss.hp-=damage;
        if(boss.hp<0){boss.hp=0;}
        showHp()
       break;
   case 'magic':
       var rand=10+(player.luck-50)-Math.floor(Math.random() *20  + 1);
        var damage= Math.floor(player.attackM+rand-(boss.defenseM/2));
        alert("You use "+player.magicName1+" on "+boss.name+" and deal "+damage+" damage points!" );
        boss.hp-=damage;
        if(boss.hp<0){boss.hp=0;}
        showHp()
       break;
   case 'potion':
       if(player.potion)
        {
        var heal = player.luck-Math.floor(Math.random()*20+1);
        alert("You drink a potion and restore "+heal+" HP");
        player.potion--
        player.hp+=heal;
        if(player.hp>player.hpMax){player.hp=player.hpMax;}
        }
        else {
              alert("You don't have any potions left!")
              playerTurn();
             }
        showHp()
        break;
   default:
    confirm("You can't do that!");
    playerTurn();
} 



};

var bossTurn=function() 
{
    if(Math.floor(Math.random()+0.5))
    {
        var rand=10+(boss.luck-50)-Math.floor(Math.random() *20  + 1);
        var damage= Math.floor(boss.attackM+rand-(player.defenseM/2));
        alert(boss.name+" use "+boss.magicName+" and deal "+damage+" damage points!" );
        player.hp-=damage;
        if(player.hp<0){player.hp=0;}
    }
    else
    {
        var rand=10+(boss.luck-50)-Math.floor(Math.random() *20  + 1);
        var damage= Math.floor(boss.attack+rand-(player.defense/2));
        alert(boss.name+" hit you and deal "+damage+" damage points!" );
        player.hp-=damage;
        if(player.hp<0){player.hp=0;}

    }
showHp()
};
var startBattle=function()
{
    showHp()
    while(player.hp>0&&boss.hp>0)
     {
         if(player.speed>boss.speed)
         {
          playerTurn();
          if(boss.hp)
          {bossTurn();}
         }
         else
         {
          bossTurn();
          if(player.hp)
          playerTurn();
         }
     }        
 if(player.hp)
 {
     alert("You won!")
     //play victory sound
     soundPlay("victory.mp3")
     //Go to loot !
     alert("Thank you for playing the demo of Retro-fighting!")
}
else
{
    alert("You lost...The woodman is now free to destroy the world...")
    soundPlay("gameover.mp3")
}


};

var showHp=function()
{
    var outputHpPlayer = document.getElementById('hpPlayer')
    var outputHpBoss = document.getElementById('hpBoss')
    var stringHpPlayer= " "+ player.fName + ":  " +player.hp+"/"+player.hpMax+" HP"
    outputHpPlayer.value=stringHpPlayer
    var stringHpBoss= " "+ boss.name + ":  " +boss.hp+"/"+boss.hpMax+" HP"
    outputHpBoss.value=stringHpBoss
}
var soundPlay=function(music)
{
document.getElementById("sound_element").innerHTML= 
"<embed src="+music+" hidden=true autostart=true loop=false>";
}




confirm("You wake up...");
alert("You're wearing strange green clothes, and a sword is laying down, next to you...");
alert("You pick up the sword...An inscription on the blade say : Link" );
alert("You notice that you are in a dark corridor, a strange woodman is looking at you");
alert("The woodman is attacking you!");
startBattle();


</script>

</body>
</html>

基本上,我只想摆脱使用alert()命令的弹出窗口,同时在显示更多文本之前仍在等待确认

由于我真的是编程初学者,请告诉我,我的方法是不是正确的... ...

谢谢! PS:英语不是我的母语,对不起

1 个答案:

答案 0 :(得分:0)

这是您的代码最初的原因吗?

getBoss(//depending on the position o the player)

如果是,则出现错误。注释一直延伸到右括号。