你如何使用jQuery将html中的文本转换为等式?

时间:2017-08-14 02:49:40

标签: javascript jquery html

我正在使用jquery创建一个简单的RPG游戏,并且遇到了将字符串转换为JS可以运行等式的数字的问题。所以我在每个角色上都有点击事件,所以当用户选择一个时,它会将html更改为跨度中的角色统计数据。我想把这些数字用在我的攻击按钮上。

每次按下按钮4时,我也想增加主角的伤害。

HTML

<div class="row">
        <div class=" col-md-3 "><button id="atk">Attack!</button></div>
    </div>
    <div class="row">
        <p class=" col-md-2 ">Health: <span id="Hp"></span></p>
        <p class=" col-md-2 ">Damage Output: <span id="Damage"></span></p>
        <p class=" col-md-2 ">Enemy Health: <span id="eHp"></span></p>
        <p class=" col-md-2 ">Enemy Damage Output: <span id="eDamage"></span></p>
    </div>

Jquery的

$("#atk").click(function(){
   foeHp= ($("#eHp").html());
   foeDmg= ($("#eDamage").html());
   mainHp= ($("#Hp").html());
   mainDmg= ($("#Damage").html());
// console.log(foeDmg);


var enemyHp = eval(foeHp + (mainDmg -4));

1 个答案:

答案 0 :(得分:0)

而不是eval,您正在寻找 Number() parseInt()。你最好将变量本身解析为整数,所以你不必为每次计算而担心这样做:

&#13;
&#13;
$("#atk").click(function() {
  foeHp = parseInt($("#eHp").html());
  foeDmg = parseInt($("#eDamage").html());
  mainHp = parseInt($("#Hp").html());
  mainDmg = parseInt($("#Damage").html());
  var enemyHp = foeHp + (mainDmg - 4);
  console.log("You did " + mainDmg + " damage.");
  console.log("The enemy now has " + enemyHp + " HP.");
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="row">
  <div class="col-md-3">
    <button id="atk">Attack!</button>
  </div>
</div>
<div class="row">
  <p class="col-md-2">Health: <span id="Hp">7</span></p>
  <p class="col-md-2">Damage Output: <span id="Damage">2</span></p>
  <p class="col-md-2">Enemy Health: <span id="eHp">3</span></p>
  <p class="col-md-2">Enemy Damage Output: <span id="eDamage">4</span></p>
</div>
&#13;
&#13;
&#13;

从不使用eval(),因为它可能会导致严重的安全漏洞。请记住, eval is 'evil'

希望这有帮助! :)