首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Dojo对话框不想阻塞整个页面

Dojo对话框不想阻塞整个页面
EN

Stack Overflow用户
提问于 2017-01-11 07:54:25
回答 2查看 319关注 0票数 0

我在对话框中显示了一个网格,没有任何问题。但问题是,对话框在后台阻塞了整个页面。有什么方法可以避免它吗?也就是说,一旦显示对话框,用户仍然可以访问页面元素,如Tab等。

EN

Stack Overflow用户

发布于 2017-01-11 20:19:23

这可以通过使用CSS来实现。当您创建一个Dialog并为其赋予id属性时,它将创建一个跨越整个页面的底层<div>,因此,除了这个新的底层<div>之外,您不能单击任何东西。幸运的是,您可以使用CSS隐藏这样的元素,并且因为元素的ID是作为#<ID of dialog>_underlay生成的,所以您可以简单地这样做:

代码语言:javascript
运行
复制
require(['dijit/Dialog', 'dijit/form/Button', 'dojo/domReady!'], function(Dialog, Button) {
  var dialog = new Dialog({
    id: 'test',
    title: 'Test',
    content: 'Hello world'
  });

  new Button({}, 'btn').on('click', function() {
    dialog.show();
  });
});
代码语言:javascript
运行
复制
/* "test" is the ID of the dialog, so I need to use #test_underlay */
#test_underlay {
  /* Setting this property to none hides the element */
  display: none;
}
代码语言:javascript
运行
复制
<head>
  <link href="https://ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit/themes/claro/claro.css" rel="stylesheet" />
  <script src="https://ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js" data-dojo-config="async: false"></script>
</head>

<body class="claro">
  <button id="btn">Click me</button>
  <input type="checkbox" />Can you still select me?
</body>

票数 0
EN
查看全部 2 条回答
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/41580540

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档