入力フォーカスに基づいてラジオボタンを確認します

Question

ユーザが入力フィールドをクリックするとラジオボタンをチェックしようとしています。私はラジオボタンを特定する方法を理解できません。以下のコードは何もしません...

$(function() { 
 
    $('.searchInput').focus(function() { 
 
    $(this).prev('.radio').find(':radio').prop('checked', true); 
 

 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table align='left' width='100%' class='searchWindow'> 
 
    <tr> 
 
    <td> 
 
     <input type='radio' class='radio' name='searchType' value='byUser'> 
 
     <th>By User</th> 
 
     <td colspan='2'> 
 
     <input type='text' id='user' size='32' class='searchInput'> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <input type='radio' class='radio' name='searchType' value='byDate'> 
 
     <th width='20%'>By Date</th> 
 
     <td width='35%'> 
 
     <input type='text' id='beg' size='8' placeholder='Begin Date' class='searchInput'> 
 
     </td> 
 
     <td width='35%'> 
 
     <input type='text' id='end' size='8' placeholder='End Date' class='searchInput'> 
 
     </td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type='radio' id='ff' name='searchType' class='radio' value='bySubject'> 
 
     <th>By Subject</th> 
 
     <td colspan='2'> 
 
     <input type='text' id='subject' size='32' class='searchInput'> 
 
     </td> 
 
    </tr> 
 
</table>

Answer 1

あなたは間違った方法を使用しています。 closest('tr')を使用して祖先trを見つけ、次にfind(':radio')を見つけてradioボタンを見つけてください。

$(this).closest('tr').find(':radio').prop('checked', true); 

Answer 2

DOMナビゲーションが鍵です。

入力（この場合はtr行）の場合は、ペアの「共通コンテナ」について考える必要があります。

次に、共通のコンテナを特定したら、findの入力を行います。

これが最良の最寄りtr祖先を見つけるために、closestを使用して達成され、その後、find

これには、次のようになります。

$(this).closest('tr').find('input.radio').prop('checked', true);