首页 > 解决方案 > 如何在 jQuery 编写的基于文本的游戏中实现战斗功能?

问题描述

我正在用 jQuery 制作一个基于文本的冒险游戏,我想实现一个战斗功能,如果你所在的房间里有敌人,你可以说“攻击敌人”,然后你和敌人交换攻击直到有人死。如果你有武器,那么你的攻击就会被加强

我试着写了这个战斗功能

    function fight(en) {
  if(rooms[currentRoom].enemys[en]!== undefined) {
    $('#game-text').append("<p>" + rooms[currentRoom].enemys[en] + "</p>");
    if(stats[user].hp > 0 || stats[en].hp > 0) {
      //user attacks
      stats[en].hp -= stats.user.attack;
      alert(stats.en.hp);
    }
    else {
      $('#game-text').append("<p>You can not fight here</p>");
    }
  }
}

现在,当该函数被调用时,它将从这条线与敌人相关联的消息,$('#game-text').append("<p>" + rooms[currentRoom].enemys[en] + "</p>"); 但是,它不会提醒健康。

这是似乎相关的代码。

 switch(command) {
    case "go":
        var dir = input.split(" ")[1];
        changeRoom(dir);
        break;
    case "help":
        showHelp();
        break;
    case "inventory":
        showInventory();
        break;
    case "take":
      var item = input.split(" ")[1];
      takeItem(item);
      break;
    case "fight":
      var en = input.split(" ")[1];
      fight(en);
      break;
    default:
        alert("invalid move!");
  }

function fight(en) {
  if(rooms[currentRoom].enemys[en]!== undefined) {
    $('#game-text').append("<p>" + rooms[currentRoom].enemys[en] + "</p>");
    if(stats[user].hp > 0 || stats[en].hp > 0) {
      //user attacks
      stats[en].hp -= stats.user.attack;
      alert(stats.en.hp);
    }
    else {
      $('#game-text').append("<p>You can not fight here</p>");
    }
  }
}

var stats= {
  "user" : {
    "hp" : 10,
    "attack" : 2
  },
  "troll" : {
    "hp" : 9,
    "attack" : 1
  }
}

这是html:

<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Text Game</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <link href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans+Condensed:400,400i,600" rel="stylesheet">
    <link rel="shortcut icon" href="favicon.ico" />
  </head>
  <body>

      <div id="game-text">
        <h3> Welcome to My Text Based Adventure!! </h3>
     </div>
    <input id="user-input"placeholder="Enter Commands"> </input>
    <script type="text/javascript" src="https://code.jquery.com/jquery-2.2.4.min.js"> </script>

    <script type="text/javascript" src="rooms.js"></script>

    <script type="text/javascript" src="script.js"></script>
  </body>
</html>

我希望输出是健康警报,但这永远不会发生

/* fix me, how am I called? */
switch (command) {
  case "go":
    var dir = input.split(" ")[1];
    changeRoom(dir);
    break;
  case "help":
    showHelp();
    break;
  case "inventory":
    showInventory();
    break;
  case "take":
    var item = input.split(" ")[1];
    takeItem(item);
    break;
  case "fight":
    var en = input.split(" ")[1];
    fight(en);
    break;
  default:
    alert("invalid move!");
}

function fight(en) {
  if (rooms[currentRoom].enemys[en] !== undefined) {
    $('#game-text').append("<p>" + rooms[currentRoom].enemys[en] + "</p>");
    if (stats[user].hp > 0 || stats[en].hp > 0) {
      //user attacks
      stats[en].hp -= stats.user.attack;
      alert(stats.en.hp);
    } else {
      $('#game-text').append("<p>You can not fight here</p>");
    }
  }
}

var stats = {
  "user": {
    "hp": 10,
    "attack": 2
  },
  "troll": {
    "hp": 9,
    "attack": 1
  }
}
<html lang="en" dir="ltr">

<head>
  <meta charset="utf-8">
  <title>Text Game</title>
  <link rel="stylesheet" type="text/css" href="style.css">
  <link href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans+Condensed:400,400i,600" rel="stylesheet">
  <link rel="shortcut icon" href="favicon.ico" />
</head>

<body>

  <div id="game-text">
    <h3> Welcome to My Text Based Adventure!! </h3>
  </div>
  <input id="user-input" placeholder="Enter Commands"> </input>
  <script type="text/javascript" src="https://code.jquery.com/jquery-2.2.4.min.js">
  </script>

  <script type="text/javascript" src="rooms.js"></script>

  <script type="text/javascript" src="script.js"></script>
</body>

</html>

标签: jquery

解决方案


推荐阅读