jQuery将值添加到表中最近的元素

Question

我有个问题。我需要在两个相同的类中添加不同的值。我需要做的是: 1.当我更改来自测试1,2,3和4的下拉列表时，文本字段中的值必须是来自文本输入(在真实系统中它们是隐藏的)的10，15 or...values。2.当我更改来自测试5,6,7和8的下拉列表时，第一个下拉列表中的值不得更改。

HTML：

<input type="text" value="10" id="price-1" size="2" />
<input type="text" value="15" id="price-2" size="2"/>
<input type="text" value="20" id="price-3" size="2"/>
<input type="text" value="25" id="price-4" size="2"/>
<table>
<tr>
    <td>
        <select class="drop">
            <option value="1">Test 1</option>
            <option value="2">Test 2</option>
            <option value="3">Test 3</option>
            <option value="4">Test 4</option>
        </select>
    </td>
    <td><input type="text" value="" class="cost" /></td>
</tr>
<tr>
    <td>
        <select class="drop">
            <option value="1">Test 5</option>
            <option value="2">Test 6</option>
            <option value="3">Test 7</option>
            <option value="4">Test 8</option>
        </select>
    </td>
    <td><input type="text" value="" class="cost" /></td>
</tr>
</table>

JS：

$('body').delegate(".drop", "change", function() {
    var end = this.value;
    var price = $('#price-'+ end).val();    
    $('.cost').val(price);

});

这是jsFiddler：JSFIDDLER

编辑:找到解决方案！

新的JS：

$('body').delegate(".drop", "change", function() {
    var end = this.value;
    var price = $('#price-'+ end).val();    
    var new_cost = $(this).parents('tr').find('.cost');
    $(new_cost).val(price);

});

Answer 1

解决方案：

JS：

$('body').delegate(".drop", "change", function() {
   var end = this.value;
   var price = $('#price-'+ end).val();    
   var new_cost = $(this).parents('tr').find('.cost');
   $(new_cost).val(price);
});