tbody focus does not work

Question

I have the following table structure:

<table>
 <tr>
  <th> </th>
  <th> </th>
  <th> </th>

</tr>
<tbody id="page-1">
 <tr>
    <td>  </td>
    <td>  </td>
    <td>  </td>    
</tr>

<tr>
    <td>  </td>
    <td>  </td>
    <td>  </td>    
</tr>
<tr>
    <td>  </td>
    <td>  </td>
    <td>  </td>    
</tr>
<tr>
    <td>  </td>
    <td>  </td>
    <td>  </td>    
</tr>
</tbody>
<tbody id="page-2">
 <tr>
    <td>  </td>
    <td>  </td>
    <td>  </td>

</tr>
<tr>
    <td>  </td>
    <td>  </td>
    <td>  </td>    
</tr>
<tr>
    <td>  </td>
    <td>  </td>
    <td>  </td>    
</tr>
</tbody>
</table>

I have tried the following jquery code to make scroll to specific tbody by id like:

page = 1;
$("#page-"+page).focus()

The above code failed to make scroll to the specified tbody. I also tried the following in order to get first tr but also failed:

page = 1;
$("#page-"+page+":first-child").focus()

The last thing that I have to mention, that tbody is loaded via ajax request and console.log($("#page-"+page).html()) works fine and prints out the html of the tbody

i think you try with function `on`.All jquery event not working for element render after document read. — Dat Nguyen, Jun 05 '17 at 01:09
As I mention `console.log()` works, so the elements, I think, known by the DOM! @DatNguyen — SaidbakR, Jun 05 '17 at 01:11
because `console.log` is javascript base.But `jQuery` code not works. — Dat Nguyen, Jun 05 '17 at 01:12

score 0 · Accepted Answer · answered Jun 05 '17 at 01:26

I have got the mistake. focus is not the suitable event for tbody in other words there is no point of focus for it. The solution is Run ScrollTop with offset of element by ID and using:

$('html, body').animate({
                 scrollTop: $('#page-'+page).offset().top -100
                }, 2000);

tbody focus does not work

1 Answers1