繰り返しのjquery数学

Question

私はこの権利を得ることができないようです。 1つの可視フィールドと4つの隠しフィールドで正しいjQueryを探していますが、これを簡単にするために、それぞれのフィールドの1つのみが必要です。

私は、入力 'oh'に数字を入力しようとしており、その行の 'ああ'フィールドのぼかしを計算しています。数学はオパールで、結果はid "ord"のスパンに表示されます。

私は多くの異なるアプローチを試しましたが、プロが何を思いつくのか不思議でした。私はそれを1つの行で動作させることができますが、次の行に対しては正しくありません。

<form action="orderProcess.php" method="post"> 
    <table id="newOrder" border="0" class="infoTable"> 
    <tr> 
     <th>name</th> 
     <th>par</th> 
     <th>type</th> 
     <th>vendor</th> 
     <th>sort</th> 
     <th>deal</th> 
     <th>Pack</th> 
     <th>OH</th> 
     <th>moq</th> 
     <th>&nbsp;</th> 
     <th>Order</th> 
     </tr> 
    <tbody> 
    <?php do { ?> 
     <tr data-id="<?php echo $row_connList['id']; ?>"> 
     <td><?php echo $row_connList['name']; ?></td> 
     <td><?php echo $row_connList['par']; ?></td> 
     <td><?php echo $row_connList['type']; ?></td> 
     <td><?php echo $row_connList['vendorId']; ?></td> 
     <td><?php echo $row_connList['sortId']; ?></td> 
     <td><?php echo $row_connList['deal']; ?></td> 
     <td><?php echo $row_connList['casePack']; ?></td> 
     <td><input name="par" type="hidden" id="par" value="<?php echo $row_connList['par']; ?>" /> 
      <input name="moq" type="hidden" id="moq" value="<?php echo $row_connList['minOrderQty']; ?>" /> 
      <input name="mot" type="hidden" id="mot" value="<?php echo $row_connList['minOrderType']; ?>" /> 
      <input name="pack" type="hidden" id="pack" value="<?php echo $row_connList['casePack']; ?>" /> 
      <input name="oh" type="text" id="oh" size="6" /> 
     </td> 
     <td><?php echo $row_connList['minOrderQty']; ?></td> 
     <td>&nbsp;</td> 
     <td><span id="ord"></span></td> 
     </tr> 
     <?php } while ($row_connList = mysql_fetch_assoc($connList)); ?> 
     </tbody> 
     <tr> 
     <td><input name="Submit" type="button" value="Submit" /></td> 
     </tr> 
    </table></form> 

Answer 1

IDは一意である必要があります。 代わりにクラスを使用して、各行の要素を識別します。ぼかしイベントはないバブルを行うので、あなたは別のイベントリスナーで行く必要があります

<input name="par" class="par" /* snip */ /> 
<input name="moq"class="moq" /* snip */ /> 

し、最終的に

<span class="ord"></span> 

すなわち

：

$('#newOrder').find('tbody').find('.oh').bind('blur', function() { 
    var $this = $(this), 
     $parentRow = $this.closest('tr'), 
     // Assuming it's integer values, parseFloat otherwise (without the radix). 
     // || 0 is a fallback value in case the values do not resemble valid ints 
     // you may want to add more sensible validation instead though 
     ohVal = parseInt($this.val(), 10) || 0, 
     parVal = parseInt($parentRow.find('.par').text(), 10) || 0; 

    $parentRow.find('.ord').text(ohVal - parVal); 
}); 

Answer 2

ここでトラバースですそれはマークアップの変更を必要としませんが、IDのclass nsteadを使用することはよりクリーンです。あなたは、単一ページに複数回、同じIDを持つことはできません。

は

$('[name="oh"]').blur(function(){ 
     var $row=$(this).closest('tr'); 
     var par=$row.find('[name="par"]').val(); 
     $row.find('td:last span').text($(this).val()-par)      
    })​