javascript - 使用 Dojo 禁用 DIV 中的所有小部件

Question

我有一个 DIV，里面有多个小部件，例如下拉菜单、按钮、文本框、复选框、单选按钮小部件。我想在单击按钮时禁用 div 内的所有小部件。有没有一种方法可以禁用整个 div，而不是遍历每个输入元素或其中的小部件。我尝试了以下，

dojo.query('#container :input').attr('disabled', 'true');

这将禁用所有输入元素，如文本框，但按钮仍然可以点击。我必须获取按钮 ID 并再次禁用它。这将是 DOM 昂贵的操作吗？

我尝试过使用 CSS pointer-events 属性，但这似乎存在浏览器问题。

什么是我可以实现这一目标的稳健有效的方式，这使得 future 的增强更容易，比如向 div 添加新的小部件和输入元素

Answer 1

如果您正在使用 dijit 组件，例如 dijit/form/Button、dijit/form/TextBox，那么您应该使用 设置功能。您可以使用 registry 获取 div 中的所有小部件。

require([
    "dojo/_base/array",
    "dojo/dom",
    "dijit/registry",
    "dojo/domReady!"
], function (array, dom, registry) {
    var _widgets = registry.findWidgets(dom.byId("fooDiv"))
    array.forEach(_widgets, function(item){
        item.set('disabled', true);
    });
});

这只是一个说明性示例，供您查看语法，希望对您有所帮助。