javascript - .onblur 函数作为变量返回。值？

Question

http://jsfiddle.net/beY6d/

我想制作一个简单的 HTML+JS 页面，基本上为用户提供 4 个文本字段来写入某些产品的名称，以及一个额外的字段，在第 5 个文本字段中显示剩余积分。

<input type="text" value="0" class="product" id="shirtItems"/><br>
<input type="text" value="0" class="product" id="pantsItems"/><br>
<input type="text" value="0" class="product" id="hatItems"/><br>
<input type="text" value="0" class="product" id="accesoryItems"/><br>
<input type="text" value="100" id="credit" disabled/>

var shirt= document.getElementById("shirtItems");
var pants= document.getElementById("pantsItems");
var hat= document.getElementById("hatItems");
var accesory= document.getElementById("accesoryItems");
var remainingDosh = document.getElementById("credit");

remainingDosh.value = 100;

必须有一个.onblur(或.onfocus)事件才能使“credit”字段显示 100 减去每个值的总和其他项目。

此外，商品的价格必须根据商品的颜色/类型而变化。像这样的东西:

shirt.onblur = function(){
    if (shirt.value == "Blue") {remainingDosh.value = remainingDosh-25}
    if (shirt.value == "Red") {remainingDosh.value = remainingDosh-20;}
};

Answer 1

如果您执行typeof returnedDosh.value，您将看到它记录string。这意味着，如果您不想冒在页面上显示 NaN 的风险，则必须将字符串转换为数字。

使用 parseInt() 进行转换，如下所示:

var remainingDosh.value = parseInt(remainingDosh,10)-25;

第二个参数10是基数，在本例中是十进制(尽管我相信如果省略它默认为十进制)。

正如所指出的，所讨论的问题是您尝试对元素 remainingDosh 进行数学计算，而不是使用它的值。

哦，还有提示:您可以使用 this.value 而不是 shirt.value，因为事件来自所述元素。