为什么开始选择关闭按钮

时间：2016-06-30 02:55:43

标签： javascript jquery html jquery-ui

我正在尝试Jquery对话 Demo

但是对话框显示选中X并且像蓝色光环一样。当外面的点击清楚时。但这种方式看起来很怪异。

我将示例代码复制到一个单独的HTML中并且行为相同。

知道为什么会发生这种情况并且是否有解决方法？

enter image description here

消息来源

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery UI Dialog - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>
  $(function() {
    $( "#dialog" ).dialog();
  });
  </script>
</head>
<body>

<div id="dialog" title="Basic dialog">
  <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>


</body>
</html>

2 个答案:

答案 0 :(得分：1)

根据link

中的 @ scott.gonzalez
  

在rc5和之前的版本中，逻辑是：       找到对话框中的第一个tabbable元素并将其重点放在上面       打开。       在当前的SVN中，逻辑是：       按以下顺序查找第一个tabbable元素：        - 内容区域        - 按钮窗格       - 标题栏       并专注于开放。       这样做是为了可访问性以确保对话框具有焦点       什么时候打开我们可以在做一些测试之后改变逻辑       如果关闭按钮是接收的，则聚焦实际的对话框div       对焦。

试试这个：

$("#dialog").dialog({
    open: function() {
      $(this).parents('.ui-dialog').attr('tabindex', -1)[0].focus();
    }
});

答案 1 :(得分：0)

默认情况下，将对话框的元素聚焦为激活或可操作的对话框（For Front Focus）。

默认情况下是：

$("#dialog").dialog({
    open: function() {
      $(this).parents('.ui-dialog').attr('tabindex', -1)[0].focus();
    }
});

你可以根据你的要求覆盖它：

      $(this).parents('.ui-dialog').attr('tabindex', -1)[0].trigger( "focusout" );
相关问题
最新问题