JqueryのprevUntil（）/ prev（）関数

Question

<tr> 
    <td> 
    <input type="button" value="+" id="add1" class="add" />   
    <input type="text" id="score1" value="0" class="score" size="1" />   
    <input type="button" value="-" id="minus1" class="minus" /> 
    </td> 

    <td> 
    <input type="button" value="+" id="add1" class="add" />   
    <input type="text" id="score2" value="0" class="score" size="1" />   
    <input type="button" value="-" id="minus1" class="minus" /> 
    </td> 

    <td><input type="button" value="enter" id="update" class="update" ></td> 
</tr> 



    <script type="text/javascript"> 
    $(function() 
    { 
     $(".add").click(function() 
     { 
      var currentVal = parseInt($(this).next(".score").val()); 
      if (currentVal != NaN) 
      { 
       $(this).next(".score").val(currentVal + 1); 
      } 
     }); 

     $(".minus").click(function() 
     { 
      var currentVal = parseInt($(this).prev(".score").val()); 
      if (currentVal != NaN) 
      { 
       $(this).prev(".score").val(currentVal - 1); 
      } 
     }); 
    }); 

    </script> 

上記のコードは正常に動作します。 今、私は計算された結果をユーザーの入力に従って警告したいと思います。ここでは失敗します。以下のコード は動作しません。また、私は1つ以上の行（すなわちtr）を持っているので、私は多くの入力テキストとボタンを持っていると考えています。私がEnterボタンの1つを押すと、私はNaNを得ました。 plsは以下のコードを修正するのに役立ちます。要素のidのは、ページ内で一意であると事実あなたが直接、IDセレクタを使用することができることを考慮すべきである

<script type="text/javascript"> 

$(document).ready(function(){ 
    $('.update').click(function(){ 

    var firstresult = parseInt($(this).prev("#score1").val()); 
    var secondresult = parseInt($(this).prev("#score2").val()); 

    if(firstresult < secondtresult) { 
     result = '2'; 
    } else if(firstresult > secondtresult) { 
     result ='1'; 
    } else if (firstresult = secondtresult) { 
     result = 'x';  
    } 

    alert(result);  
    }); 
}); 

</script> 

Answer 1

を感謝と考えています。 $(this).prev("#score1")は、更新ボタンの兄弟ではないため何も選択しません。score2も同様です。これを試して。 IDを参照するときprev/nextを用いてスタータため

$(document).ready(function(){ 
    $('.update').click(function(){ 

    var firstresult = parseInt($("#score1").val()); 
    var secondresult = parseInt($("#score2").val()); 

    if(firstresult < secondresult) { 
     result = '2'; 
    } else if(firstresult > secondtresult) { 
     result ='1'; 
    } else if (firstresult = secondresult) { 
     result = 'x';  
    } 

    alert(result);  
    }); 
}); 

Answer 2

は、準最適です。本質的に、IDは一意でなければならないので、同じ名前の "次の"または "前の"要素があってはいけません。 $('#elementId')

第2に、自分の兄弟（同じ親タグ内の要素）または<tr>要素であっても、最も一般的な要素ですべての関係を壊して見つけることができます。あなたの要素はそのように。あなたが行くことができるように（範囲を失うことなく）要素を通って木を横断してください。あなたは、たとえば、siblings()から同じ行のスコアボックスを取得することができます

.addまたは.minusいずれかから：たとえば

$(this).siblings('.score').val(); 

行の値を比較するために、<tr>タグ（複数可）を活用します：

// .score element in next row 
$(this)   // from the button clicked 
    .closest('tr') // move up to the <tr> 
    .next()   // on to the next row 
    .find('.score'); // then in this row, find the .score element 

// .score element in previous row 
$(this) 
    .closest('tr') 
    .prev()   // same as above, just go up a row 
    .find('.score'); 

それでも、助けてあなたが持っているもののjsfiddle.netを投稿し、私たちはあなたを助けることができると確信していが必要な場合。