0

以下のコードからinput[radio]、テーブルで選択した行を確認することができません。以下のコードはHTML5JQuery 1.10.2を使用しています。

<!DOCTYPE HTML>
<html>
    <head>
        <style type="text/css">
            input[type="radio"] {
                margin: 10px;
            }
        </style>
        <script src="jquery-1.10.2.min.js" />
        <script>            
            $(function() {
                $("#table_list tr").click(function() {
                    $(this).find("td input:radio").prop("checked", true);
                });
            });
        </script>
    </head>
    <body>
        <table id="table_list">
            <thead>
                <th></th>
                <th>Name</th>
                <th>Email</th>              
            </thead>
            <tbody>
                <tr>
                    <td><input type="radio" name="record"/></th>
                    <td>Sample1</td>
                    <td>sample_1@sample.com</td>
                </tr>
                <tr>
                    <th><input type="radio" name="record"/></th>
                    <td>Sample1</td>
                    <td>sample_1@sample.com</td>                    
                </tr>
            </tbody>
        </table>        
    </body>
</html>
4

2 に答える 2

3

最初の入力は atdにあり、2 番目の入力は a にありthます。td入力セレクターからを削除する必要があります: working codepen

$(function() {
    $("#table_list tr").click(function() {
        $(this).find("input:radio").prop("checked", true);
    });
});

添付の JavaScript は両方で機能します。もう 1 つのオプションは、thを aに変更してtd、セレクターをそのままにしておくことです。

注:コメントで言及されているように、マークアップの問題がさらにいくつかあります。(忘れtrthead)

于 2013-08-12T09:51:54.733 に答える
0

http://jsbin.com/atosaq/4/editをご覧ください。

$(document).ready(function(){
  $('#table_list tr').on("click",function(){
$(this).find('input[type=radio]').prop("checked", true);
  });
});
于 2013-08-12T10:04:49.433 に答える