在引导程序中关闭模式后如何取消模式触发按钮的焦点 [英] How can I unfocus the modal trigger button after closing the modal in bootstrap

问题描述

关闭模式后我似乎无法模糊按钮.

I can't seem to blur the button after closing the modal.

$('#exampleModal').on('hidden.bs.modal', function(e){
        $('button').blur();
    });

我已经尝试了上述方法，但它似乎仍然没有模糊它.我几乎什么都试过了.唯一的解决方案是在模型完成隐藏过渡后设置超时并模糊它.有更好的解决方案吗?

I've tried the above and it still doesn't seem to blur it. I've tried almost everything. The only solution is to set a timeout and blur it after the model finishes the hidden transition. Any better solution?

推荐答案

使用 .one() 绑定在模态插件中设置返回到触发元素的焦点，遗憾的是无法取消绑定.好消息是我们可以做到这一点:

The focus back to the trigger element is set within the modal plugin using a .one() binding, which unfortunately cannot be unbound. The good news is we can do this:

$('#myModal').on('shown.bs.modal', function(e){
    $('#myModaltrigger').one('focus', function(e){$(this).blur();});
});

其中 #myModaltrigger 是模态触发按钮的 ID.使用 .one() 绑定的原因是只有在显示模式后才会调用要模糊的函数.一旦它隐藏，并且发生焦点/模糊，按钮就可以正常聚焦，就像通过 Tab 键一样，它不会自动模糊.

Where #myModaltrigger is the ID of the modal trigger button. The reason to use the .one() binding is so that the function to blur will be called only after the modal is shown. Once it hides, and the focus/blur happens, the button can be focused normally, like by tabbing to it, without it automatically blurring.

请参阅 此工作示例

这篇关于在引导程序中关闭模式后如何取消模式触发按钮的焦点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！