6

我似乎无法正确地将 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 小部件仍然是主体的 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,我想我只是太缺乏经验,没有意识到这个案子很重要)?

4

3 回答 3

4

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

例如

<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 除非它被更改。

于 2010-05-24T03:37:33.833 回答
2

在执行 dojo.connect 时尝试以下操作:

  var inputEvents = [];  //Global var

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

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

于 2010-04-01T16:48:27.490 回答
1

在您的代码中,您将处理程序连接到 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 连接到多个小部件,那就另当别论了。

于 2010-04-02T07:37:23.403 回答