javascript - 我无法让 onChange 触发 dijit.form.Select

Question

我似乎无法将 onchange 事件正确附加到 dijit.form.Select 小部件。但是，我是 Web 开发的新手，所以我可能会做一些完全愚蠢的事情(尽管，据我所知(并且我已经阅读了我能找到的所有文档)我不是)。我确保 body 类与 dojo 主题相匹配，我为我使用的所有小部件(和 dojo.parser)执行 dojo.require()，但仍然是 nada。我使用的代码是:

dojo.addOnLoad(function () {
    var _query = dojo.query('.toggle');
    for (var i in  _query) {
        dojo.connect(_query[i], 'onchange', function (ev) {
            console.log(ev + ' fired onchange');
        });
    }
});

如有任何帮助，我们将不胜感激。

补充:在深入了解 dijit 如何呈现小部件后，我发现当我将 dojoType='dijit.form.Select' 属性值对添加到我的 html 元素(以声明方式执行此操作)时，dijit 实际上呈现单行两列表。该表的第一个元素是一个跨度(具有类 dijitSelectLabel)，我假设它只显示选定的(或默认的)元素。它的第二个元素似乎是一个呈现为向下箭头的按钮，可切换菜单项的显示以响应某些 DOM 事件。此外(我认为这非常漂亮)，dijit 实际上不会将选择选项放置在 DOM 树中，直到其中一个事件被触发。我在新页面加载后(在我单击任何内容之前)立即查看了 Firebug 中的 HTML，并且找不到第二个选项。然后，一旦我单击箭头按钮，就会出现一个 dijit.Menu 小部件，dijit 会将一个 dijit.Menu 粘贴到 body 节点的末尾；在我单击其他地方后，Menu 小部件仍然是 body 的 lastChild，现在它只是隐藏并且没有附加到表单。选择小部件。

如果我只想根据用户选择的项目在 DOM 树中放置一个不同的 dijit.form 小部件，真的会这么复杂吗？

结论: 原来是大小写问题。

dojo.connect(widget_obj, 'onChange', function_obj);

有效，而

dojo.connect(widget_obj, 'onchange', function_obj);

没有。

所以我是对的，我完全是愚蠢的。我假设因为全小写版本在将 html 标记作为属性放入其中时有效，所以 Dojo 会同样对待它。这是有道理的，因为 dijit.form.Select 没有 .onchange 属性，但有一个 .onChange 属性。 (我最终坚持使用 .Select 而不是 .FilteringSelect，因为我不会给我的用户留下任何他们可以输入内容的印象。)所以，我给你们中的哪一个答案(因为你们俩在你的帖子中有 onChange，我想我只是太缺乏经验，无法意识到这个案例很重要)？

Answer 1

对于通过网络搜索找到此页面的任何其他人，您可能犯了与我相同的错误.. 复制粘贴您的标记，使每个标记都具有相同的“值”。

例如

<select dojoType='dijit.form.Select' onChange="fn">
<option value='foo'>Foo 1</option>
<option value='foo'>Foo 2</option>
<option value='foo'>Foo 3</option>
</select>

fn() 永远不会被调用，因为更改处理程序代码会根据先前选择的值检查新值并且不会触发 onChange 除非它发生更改。