3

次のようなHTMLコードがあります。

<table id="items">
 <tr class="item-row">
        <td class="item-name"><div class="delete-wpr"><a class="delete" href="javascript:;" title="Remove row">-</a></div></td>
        <td><input type="text" id="slslno" class="slno"/></td>
        <td><input type="text" class="cost"/></td>
        <td><input type="text" class="qty"/></td>
        <!--  <td><span class="price"></span></td>-->
        <td class="price"></td>
        <a class="add" id="addrow" href="javascript:;" title="Add a row">+</a> </tr>

</table>

行を動的に追加する「行を追加」というボタンがあります。

次に、slno フィールドのぼかし中に更新関数を呼び出すこのバインドがあります。

  function bind()
  {
      $(".slno").blur(update_unitcost);
  }

関数update_unitcostは次のとおりです。

function update_unitcost()    
{
    var unitprice1=$(this).val();
    unitprice={"unitpricereal":unitprice1};
    $.ajax({
        type: "POST",
        url: "findcost.php",
        data: unitprice,        

        success: function(unitp){           
            $( ".cost" ).val(unitp);        
        }
    });                
}

上記の関数では、thisセレクターで値を取得できますが、次の行で値を設定すると、

$( ".cost" ).val(unitp);

.costすべての " " クラスをその特定の番号にリセットするだけです。委任された個々の行に値を設定するにはどうすればよいですか? 私も次のアプローチを試みましたが、失敗しました。

 var row = $(this).parents('.item-row');
 row.find('.cost').val(unitp);
4

1 に答える 1

1

関数に変数を設定して.cost、すべての要素ではなく、更新する特定の要素のみを対象にします。

function update_unitcost()    
{
    var unitprice1=$(this).val();
    var costItem = $(this).parent().parent().find('td input.cost');
    unitprice={"unitpricereal":unitprice1};
    $.ajax({
      type: "POST",
      url: "findcost.php",
      data: unitprice,        

      success: function(unitp){           
       costItem.val(unitp);        
      }
    });                
}
于 2016-01-28T16:29:37.737 に答える