Twitter bootstrap 在模式关闭后，如何防止焦点集中在引导模式的切换按钮上？

我有一个切换引导模式的按钮。按钮本身被包装在一个div中，因此鼠标悬停时会显示一个工具提示

当我关闭模式时，按钮会聚焦，工具提示会显示，而不会将元素悬停

<span data-toggle="tooltip" data-placement="top" data-title="Tooltip">
    <button  data-toggle="modal" data-target="#modal">Toggle</button>
</span>

 <div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-hidden="true">
     <div class="modal-dialog">
         <div class="modal-content">
             <div class="modal-header">
                 <button type="button" class="close" data-dismiss="modal">&times;</button>
             </div>
             
             <div class="modal-body">
                 <p>lorem ispum dolor sit amet</p>
             </div>
             
             
             <div class="modal-footer">
                 <button type="button" class="btn btn-primary">Submit</button>
                 <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
             </div>
         </div>
     </div>
</div>

你们知道有什么方法可以在模式关闭时防止焦点聚焦在切换按钮上吗？

根据，需要指定触发工具提示的内容。选项有

单击

、

悬停

、

聚焦

和

手动

，默认设置是同时具有

悬停

和

聚焦

。因此，只需将

data trigger=“hover”

添加到元素中：

<span data-toggle="tooltip" data-placement="top" data-title="Tooltip" data-trigger="hover">
    <button  data-toggle="modal" data-target="#modal">Toggle</button>
</span>

切换

---

小提琴示例：

过了一段时间，我将插话讨论这个话题。我避免使用引导数据属性，而是使用Jquery。我通过以下方式实现了这一点

// Use whatever to trigger the modal, in this case a class
// Get the modal trigger
var modalTriggerObj = $("body").find(".modal-trigger");

modalTriggerObj.on('click', function(e) {
  e.preventDefault();

  // Opens the modal
  $("#modal").modal();
  // Light up the modal trigger with css
  $(this).addClass('modal-on');

  // When the modal hides ...
  $("#modal").on('hide.bs.modal', function() {
    // Return the trigger to its default state
    modalTriggerObj.removeClass('modal-on');
  });
});

---

这是我使用的解决方案，效果很好：

$('.modal').on('hidden.bs.modal',function(event){
  event.stopImmediatePropagation();
});

---

请注意，模态之所以这样做是出于良好的可访问性原因。否则，用户在模式关闭后会丢失页面的哪一部分，这既迷惑又烦人（他们必须通过tab/navigate一路返回到原来的位置）。嗨，你知道我如何阻止焦点吗？@PhuNguyen you start by:）

$('.modal').on('hidden.bs.modal',function(event){
  event.stopImmediatePropagation();
});