我不能让onChange为dijit.form.Select开火

Question

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

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实际上不会将select选项放到DOM树中。我在新的页面加载之后(在单击任何内容之前)查看了firebug中的HTML，但没有找到第二个选项。然后，当我单击箭头按钮时，有一个dijit.Menu小部件，dijit将一个dijit.Menu粘贴到body节点的末尾；在我单击其他地方后，Menu小部件仍然是body的lastChild，现在它只是隐藏，没有附加到form.Select小部件。

如果我想做的就是根据用户选择的项在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

在执行dojo.connect时，请尝试以下操作：

  var inputEvents = [];  //Global var

  inputEvents.push(dojo.connect(dijit.byId(inputFldStr), "onChange", eventFuncObj));

将连接存储在全局变量中。

Answer 2

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

例如：

<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。

Answer 3

在您的代码中，您将一个处理程序连接到dom节点的'onchange‘事件，而不是dojo小部件。dojo.query返回一个NodeList对象-匹配查询的节点的集合。

在这种情况下，连接到小部件的'onChange‘事件更可靠，如GoinOff所示。只是对他的答案做了一点补充，以确保你做得正确。

假设这是您的html (在Dojo的后续版本中，dijit.form.Select已被dijit.form.FilteringSelect取代)：

<input dojoType="dijit.form.FilteringSelect" id="stateInput" store="stateStore" searchAttr="name" name="state"/>

然后，您将以这种方式连接到'onChange‘(您也可以将连接存储在某个数组中，以便能够按照GoinOff的建议在以后断开它)：

dojo.addOnLoad (function () {
   dojo.connect(dijit.byId("stateInput"), "onChange", function(){});
}

但是，如果您不知道您的小部件的id，并且想要使用dojo.query连接到多个小部件，那就另当别论了。