javascript - jQuery - 获取最接近的文本框的值并将其分配给变量

Question

如何获取最接近的文本框的值并将其分配给变量？然后，在获取值后，通过将其乘以前一个文本框的值来更改该文本框的当前值。我有三个具有相同输入元素的 div 实例，因此我认为 .closest() 或 .next() 可以帮助我。这是我的代码片段

HTML

<div class="box">
    <b>1</b>
    <input type="text" name="quantity" value="1"/>
    <input type="checkbox" name="ignoreThisCheckbox" checked="checked"/>
    <input type="text" name="price" value="10"/>
</div>

<div class="box">
    <b>2</b>
    <input type="text" name="quantity" value="1"/>
    <input type="checkbox" name="ignoreThisCheckbox" checked="checked"/>
    <input type="text" name="price" value="10"/>
</div>

<div class="box">
    <b>3</b>
    <input type="text" name="quantity" value="1"/>
    <input type="checkbox" name="ignoreThisCheckbox" checked="checked"/>
    <input type="text" name="price" value="10"/>
</div>

JS

$("input[name=quantity]").each(function(){
    $(this).bind("change keyup", function(){
        var q = $(this).val();
        var p = parseFloat($(this).closest("input[name=price]").val()).toFixed(2);
        var amount = q * p;
        $(this).closest("input[name=price]").val(amount)
        console.log(amount);
    })
})

非工作演示

http://jsfiddle.net/c6yfS/

感谢您的回复

/* 注意 */

该复选框的目的只是为了表明我在相关的两个元素之间有一个复选框。

Answer 1

正如其他发帖者所提到的，您可以使用 .siblings 作为 .closest 在 DOM 树(即父元素)中搜索。但是，您的代码中也存在逻辑错误，因为如果数量发生变化，您检索到的价格永远不是正确的单价。您可能需要一个单独的单价隐藏值来促进这一点

在此处查看更新的代码:http://jsfiddle.net/c6yfS/1/