jquery-ui - jQuery UI 对话框在输入时关闭

标签 jquery-ui jquery-ui-dialog enter

当我打开一个 jQuery UI 对话框小部件并且对话框中的内容包含一个文本框时,当我按下 enter 时对话框会自动关闭。这似乎只有在使用 IE9 或 IE10 时才会发生。当我在文本框中按回车键时,我不希望对话框关闭。

我有以下 HTML:

<!DOCTYPE html>

<html>

<head>
<title>Testpage</title>

<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<script type="text/javascript">
    $(document).ready(function() {
        $('#myDialog').dialog();
    });
</script>

</head> 

<body>  

    <div id="myDialog">
        Some text           
        <input type="text"></input>
    </div>

</body>
</html>

当您打开此 HTML 页面时,对话框将在您按下回车键时关闭(仅在 IE9+ 中)。有什么建议吗?

最佳答案

在 jQuery UI 1.10.x 中,右上角的关闭按钮似乎从 <a> 更改为到 <button> .由于此按钮未指定 type属性,它被认为是 type="submit" .当您在 IE9+ 中按回车键时,浏览器会查找提交按钮,找到关闭按钮并按下它。

有几种方法可以解决这个问题,我认为最好的方法是通过覆盖 _init 来更正关闭按钮的类型。 ui.dialog的功能:

var baseInit = $.ui.dialog.prototype._init;
$.ui.dialog.prototype._init = function () {
    baseInit.apply(this, arguments);

    // Make the close button a type "button" rather than "submit". This works
    // around an issue in IE9+ where pressing enter would trigger a click of
    // the close button.
    $('.ui-dialog-titlebar-close', this.uiDialogTitlebar).attr('type', 'button');
};

关于jquery-ui - jQuery UI 对话框在输入时关闭,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16604922/

相关文章:

带有下拉操作列表的 jQuery UI 对话框按钮

javascript - 检索按键事件

forms - 如何通过在 Powershell 中按 Enter 键来调用按钮单击

javascript - jquery-ui 向左滑动第一次不起作用

javascript - 使用 ASP.NET MVC 服务器端在任何站点上显示 JS(jQuery) 小部件

javascript - 如何在某些被调用的函数中传递jquery对话框按钮函数的返回值

C 如何正确使用sscanf support

javascript - 拖放(jquery ui-droppable)在 AngularJS 中不起作用

jquery - 如何同时淡入淡出和滑动 jQuery 动画

jQuery UI 对话框标题栏问题