Question

我有一个Twitter Bootstrap模式，其中包含一个带有jQuery UI Autocomplete的字段。当显示自动完成建议菜单时，用户可以按键盘上的ESCAPE关闭它。但是，这也会关闭Bootstrap模式，因为它还会监听正在按下的ESCAPE键。

只要自动完成建议菜单被ESCAPE键关闭，有没有办法阻止模态关闭？

注意：我不希望完全禁用模态上的转义键行为 - 仅当自动完成菜单打开并通过ESC关闭时。

Answer 1

你只需要通过JavaScript（Jquery）使用Bootstrap模态属性，就这样：

假设您的模态名称为#MyModal，请使用此选项以防止使用键盘关闭

$('#myModal').modal({keyboard:false});

查看我在Bootply中的下一个示例中创建的实例！

问候＆amp;快乐编码

Answer 2

尝试这样的事情。让我们抓住转义键事件和模态隐藏事件：

var isEscapeKey = false;

$('#myAutoCompleteTextBox').on('keydown',function(e){
    if (e.keyCode == 27){
        isEscapeKey = true;
    } else{
        isEscapeKey = false;
    }
}).on('blur',function(){
    isEscapeKey = false;
});

$('#myModal').on('hide.bs.modal', function (e) {
    if (isEscapeKey){
        return false;
    }
});

未经测试，但理论上应该在隐藏模态之前调用hide.bs.modal事件，并且可以在此处停止。

如何防止jQuery UI自动完成ESCAPE关闭Bootstrap模式？

2 个答案: