Ukit模态框如何防止按下Esc键关闭？

Question

我正在使用Angularjs和Uikit，需要创建一个指令来防止在按下ESC键时关闭模态框。我尝试了以下方式：

mainApp.directive('ngEsc', function () {
    return function (scope, element, attrs) {
        element.bind("keydown keypress keyup", function (event) {
            if(event.which === 27) {
                event.preventDefault();
            }
        });
    };
});

然后将指令放在模态框上

但它仍然关闭。还有其他方法吗？

- Atlas91

Answer 1

以下是我在我的Angular 7项目中解决此问题的方法： uikit.modal("#modalR", { bgClose: false, escClose: false, modal: false, keyboard:false}).show(this.data) 如需更多信息，请访问下面的链接： https://github.com/uikit/uikit/blob/develop/src/js/core/modal.js#L15:L21

- Phebian Chukwurah

Answer 2

您尝试使用了选项keyboard:false吗？

UIkit.modal("#modal element", {bgclose: false, keyboard:false}).show();

在我的情况下它起作用了。

您还可以查看 modal.js

- Jose Silva

Answer 3

你可以尝试使用 "return false" 代替 preventDefault：

mainApp.directive('ngEsc', function () {
    return function (scope, element, attrs) {
        element.bind("keydown keypress keyup", function (event) {
            if(event.which === 27) {
                return false;
            }
        });
    };
});

- alexey

---

谢谢，它正在工作，但我需要聚焦整个模态框才能使其工作。我的意思是，当它打开时，如果我按esc键，它不起作用并且关闭模态框。如果我打开模态框，然后点击它，然后再按esc键，它就可以正常工作而不会关闭它。有没有办法解决这个问题？ - Atlas91