.hoverエフェクトの子要素にクラスを追加する

Question

入力フィールドにクラス名を追加したいが、jqueryのすべてのロジックがわからない。
htmlコードは

<tr class="jp_contact"><td>text</td><td>text</td><td>text</td><td><input name="in_val" ></td></tr> 
<tr class="jp_contact"><td>text</td><td>text</td><td>text</td><td><input name="in_val" ></td></tr> 
<tr class="jp_contact"><td>text</td><td>text</td><td>text</td><td><input name="in_val" ></td></tr> 

タラは次のとおりです。

$('.jp_contact').each(function(e){ 
     var currentRow = $(this); 
     $(this).hover(
      function(){ 
        $(this).addClass('jp_hover'); 
        $(currentRow + " td:last").removeClass('dis_button'); 
       }, 
      function(){ 
        $(this).removeClass('jp_hover'); 
        $('input[name="in_val"]').addClass('dis_button'); 
       }); 
    }); 

Answer 1

あなたのロジックは欠陥があります。ホバーでは、現在の行の最後のセルからdis_buttonクラスを削除します。ホバリング時に、存在しないinput要素にdis_buttonクラスを追加します。

また、文字列コンテキストでjQueryオブジェクトを使用することはできません。 $(currentRow + " td:last")は$("td:last", currentRow)（$(currentRow).find("td:last")の略）である必要があります。

$('.jp_contact').each(function(e){ 
    var currentRow = $(this); 
    $(this).hover(
     function(){ 
       $(this).addClass('jp_hover'); 
       $("td:last", currentRow).removeClass('dis_button'); 
      }, 
     function(){ 
       $(this).removeClass('jp_hover'); 
       $("td:last", currentRow).addClass('dis_button'); 
      }); 
});