2017-08-14 32 views
-1

我正在用jquery创建一个简单的RPG游戏,并且遇到了将字符串转换为JS可以运行方程式的数字的问题。所以我在每个字符上点击事件,所以当用户选择一个字符时,它会将html更改为跨度中的字符统计信息。我想将这些数字用于我的攻击按钮。如何将html中的文本转换为使用jQuery的公式?

我也想通过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

'eval'在这里似乎完全没有根据。你为什么使用它?如果您需要将字符串转换为数字,请使用'parseInt'。 – Carcigenicate

+1

对各个值使用'Number()'函数,一元加运算符'parseFloat()'或'parseInt()',然后可以进行任何您喜欢的数学运算。 – nnnnnn

回答

0

相反eval,你正在寻找Number()parseInt()。你会更好解析变量本身为整数,所以你不必担心这样的计算:

$("#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."); 
 
});
<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>

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

希望这会有所帮助! :)

+0

它的确如此!谢谢!! –

+0

太棒了;乐意效劳!一旦你确认这个解决方案解决了你的问题,请不要忘了点击表决下方的灰色检查来[**接受这个答案**](https://stackoverflow.com/help/someone-answers)按钮 - 这会将其从“未答复的问题”队列中移除,并为问题提问者和问题答疑者授予声誉。询问任何问题后,您可以在15分钟内完成。当然,在说,你没有义务标记任何答案是正确的,但它确实有助于保持StackOverflow上的事情顺利进行:) –

+0

刚刚做到了!还有一件事,如果你能最后帮我一次。我如何设置它,所以每次点击它会将伤害输出增加4的按钮。我可以让它添加4次,但不是每次点击事件激活。 –

相关问题