jquery - 将 jQuery keyup 更新隔离到一个类

Question

小提琴：http: //jsfiddle.net/MhWm5/16/

我有一些具有动态 ID 的动态生成的表行/值

<td class="control-group">
    <input name="price[418]" class="price" value="199.00">
    <span class="calcprice">I want this SPAN tag to update</span>
</td>
<td  class="control-group">
    <input name="price[424]" class="price" value="67.00">
    <span class="calcprice">I DO NOT WANT this SPAN tag to update</span>
</td>

我有一个简单的 jQuery keyup 函数，用于在此处更新 SPAN：

$('.price').keyup(function() {

   var AskPrice    = $(this).val();
   var calcSpan    = ".calcprice";
   var itemCost = AskPrice * (.8);
   console.log(itemCost);  // just for giggles

   $(this).parents().find(calcSpan).text(" You will receive $" + itemCost );

});    ​  ​

当用户在第一个输入字段中键入时，跨度会在两个表行中更新，这是我不想要的。我可以在每个跨度上调整类的名称，但我认为这没有帮助。

任何帮助都很棒。

Answer 1

$(this).parent().find(calcSpan).text(" You will receive $" + itemCost );

父母，不是父母

Answer 2

我会使用该siblings()功能来做到这一点。

见例子：http: //jsfiddle.net/MhWm5/26/

另请注意，我必须更改您的标记。你有td没有嵌套在tableor中的标签，tr所以它没有像你想象的那样被渲染。这实际上可能是您的问题的根本原因。

Answer 3

更改一个跨度的名称，然后更新该跨度！

工作演示：http: //jsfiddle.net/epinapala/MhWm5/24/

<span class="calcprice1">I want this SPAN tag to update</span>

然后在你的 JS

$('.price').keyup(function () {
    var AskPrice = $(this).val();
    var calcSpan = ".calcprice1";
    var itemCost = AskPrice * (.8);
    console.log(itemCost);
    $(this).parent().find(calcSpan).text(" You will receive $" + itemCost);
});