小编Mir*_*cea的帖子

在模态关闭后,如何防止焦点关注Bootstrap模式的切换按钮?

我有一个切换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>
Run Code Online (Sandbox Code Playgroud)

看看到底发生了什么:http://jsfiddle.net/6t3kxhLb/

到目前为止我唯一能解决的办法是在hidden.bs.modal事件激活时模糊按钮.但我对结果并不满意.

这是我的解决方法:

$('#modal').on('hidden.bs.modal', function(event){
    setTimeout(function(){
      $('[data-toggle="modal"]').blur();
    });
 });
Run Code Online (Sandbox Code Playgroud)

当模态关闭时,你们知道有什么方法可以防止对切换按钮的关注吗?

modal-dialog tooltip twitter-bootstrap

6
推荐指数
1
解决办法
3154
查看次数

标签 统计

modal-dialog ×1

tooltip ×1

twitter-bootstrap ×1