Question

我有一张表格如下：

<table class="table table-bordered table-hover" style="background: white; margin-top: 5px;">
   <thead>
       <tr>
            <th style="width: 5%">#</th>
            <th>Group</th>
            <th style="width: 30%">Sub Group</th>
       </tr>
   </thead>

   <tbody id="allAccessInfo" name="allAccessRow">
       <tr class="test" access_id="1">
         <th scope="row"><i class="fa fa-file-photo-o"></i></th>
         <td id="name_file_edit_undefined">Custom Order</td>
         <td id="name_file_edit_undefined">Art Tab</td>
      </tr>
      <tr class="test" access_id="2">
         <th scope="row"><i class="fa fa-file-photo-o"></i></th>
         <td id="name_file_edit_undefined">Custom Order</td>
         <td id="name_file_edit_undefined">Credit Tab</td>
      </tr>
      <tr class="test" access_id="3">
         <th scope="row"><i class="fa fa-file-photo-o"></i></th>
         <td id="name_file_edit_undefined">Custom Order</td>
         <td id="name_file_edit_undefined">Imprint Tab</td>
      </tr>
      <tr class="test" access_id="4">
         <th scope="row"><i class="fa fa-file-photo-o"></i></th>
         <td id="name_file_edit_undefined">Custom Order</td>
         <td id="name_file_edit_undefined">Information Tab</td>
       </tr>
 </tbody>
</table>

我想点击行的access_id。我尝试按照以下方式进行操作，但它给出了undefined：

    $('tbody[name="allAccessRow"]').click(function(event)
            {

                alert($(this).attr('access_id'));

            }
    );

我怎样才能得到它？因为，我得到带有ajax的表行我无法将其与表行绑定为$('tr.test').click(function(event)，因为当javascript加载时，该行最初不存在。所以，我绑定了<tbody id="allAccessInfo" name="allAccessRow">点击事件。

Answer 1

问题在于，代码上下文中的this不是tr，而是tbody。并且tbody没有access_id属性 - 因此＆＃34;未定义＆＃34;。您可以按如下方式更改它：

$('tbody[name="allAccessRow"]').on('click', 'tr.test', function(event)
    {
        alert($(this).attr('access_id'));
    }
);

这可以解决您的问题。

Answer 2

假设您正在使用AJAX将内容附加到tbody。将这些行附加到代码后，请将事件单击绑定到tr：

$('#allAccessInfo').find('tr')
    .unbind('click')
    .bind('click', function(event)
    {
       alert($(this).attr('access_id'));
    }
);

我们发现 tr（不是tbody）

Answer 3

您可以在获取每一行时在成功处理程序中绑定click事件。

$.ajax(config).done(function(response){

    $('TR',response).each(function(i,tr){

         $(tr).bind('click', this.someCommonCallback );

         $('tbody').append( tr );
    });
});

其中someCommonCallback返回您要从该行搜索的属性。

获取单击的表行的属性

3 个答案: