防止零件从被标签

Question

我有以下的HTML标记：

<tr class="table_row"> 
    <td tabindex="-1" class="delete_row"><button class="btn btn-small btn-danger">X</button></td> 
    <td> 
     <span class="row0" contenteditable="true">Text 1</span> 
    </td> 
    <td> 
     <span id="tourCellData" class="row0" contenteditable="true">Text 2</span> 
    </td> 
    <td> 
     <span class="row0" contenteditable="true">Text 3</span> 
    </td> 
    <td> 
     <span class="row0" contenteditable="true">Text 4</span> 
    </td> 
      <td> 
     <span class="row0" contenteditable="true">Text 5</span> 
    </td> 
</tr> 

我在寻找各种方法来防止与类“.delete_row”的元素被标签。我搜索了StackOverflow并发现'tabindex =“ - 1”'应该做这项工作。但它不适合我。

我发现用jQuery的解决方案：

$("#parentSelector").on("focus", ".delete_row", function() { 
    $(this).next().find("span").focus(); 
}); 

有没有使用jQuery的替代解决方案？

Answer 1

下面是解 Fiddle

添加tabindex="-1"到您的按钮元素

<td class="delete_row"><button tabindex="-1" class="btn btn-small btn-danger">X</button></td>