Question

尝试根据用户点击将焦点移动到特定的表格行。

<script>
   $(function(){
       $('.filter').click(function(){
           var id = $(this).attr('id');
           var row = "post_"+id;

           //alert(row) == post_1234

           $('#'+row).find('tr').focus();
       });
});
</script>

<table id='activity'>
   <tr id='1234' class='filter'><td>Some Data</td></tr>
   <tr id='1234' class='filter'><td>Some Data</td></tr>
   <tr id='1234' class='filter'><td>Some Data</td></tr>   
</table>

//Tons of data that scrolls down page quite a distance..

<table>
 <tr id='post_1234'><td>...</td></tr>
 <tr id='post_1235'><td>...</td></tr>
 <tr id='post_1236'><td>...</td></tr>
</table>

我试过了：

$('.filter').click(function(){
  var id = $(this).attr('id');
  var row = "post_"+id;

  //alert(row) == post_1234

  $('#'+row).find('tr').focus();
});

什么都不做

$('#'+row).focus();

也没有。

警告正确显示，并显示正确的ID。

作为测试我这样做了：

 $('#'+row).find('td').addClass('someClass');

并正确添加了课程。

我错过了什么？

Answer 1

您可能需要在下表或focus中直接找到它。我已将焦点更改为CSS以查看输出。

$('.filter').on('click', function() {
  var id = $(this).attr('id');
  var row = "post_" + id;
  console.log(row);
  // $("table").find($("#" + row).css("color", "red")); //Use this
  $("#" + row).css("color", "red"); //Or this
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id='activity'>
  <tr id='1234' class='filter'>
    <td>Some Data</td>
  </tr>
  <tr id='1234' class='filter'>
    <td>Some Data</td>
  </tr>
  <tr id='1234' class='filter'>
    <td>Some Data</td>
  </tr>
</table>

<table>
  <tr id='post_1234'>
    <td>...</td>
  </tr>
  <tr id='post_1235'>
    <td>...</td>
  </tr>
  <tr id='post_1236'>
    <td>...</td>
  </tr>
</table>

jquery设置表格行焦点

1 个答案: