Dojo：dijit.form.select 在第一次点击时不会触发“onClick”事件答案

【问题标题】：Dojo: dijit.form.select won't fire "onClick" event the first time clickedDojo：dijit.form.select 在第一次点击时不会触发“onClick”事件
【发布时间】：2011-01-07 19:00:15
【问题描述】：

我浏览了 Dojo 文档和 API 并尝试了 Google，但找不到解决问题的方法，希望这里的任何人都可以帮助我。

我正在尝试以编程方式（使用 Dojo 1.4）创建 dijit.form.select 并连接到小部件的“onClick”事件。这是我的代码的一部分：

var dataSelect = new dijit.form.Select({
        id    : "myselect",
        name  : "myselect",
        labelAttr: "label",
        labelType: "html"
      },
      "selectid");
      dataSelect.addOption({value: "value", label: "first item label"});

      dojo.connect(dataSelect, "onClick", function() {
        alert("clicked!");
      });

它的作用：创建一个选择框以替换 ID 为“selectid”的输入字段，创建一个选项“第一个项目标签”。一切都好，直到这里。然后我连接到选择的“onClick”事件，该事件应该通过 AJAX 加载更多选项（但在本例中仅显示警报以用于测试目的）。

问题：当我单击下拉列表旁边的小箭头时，会触发事件（确定）。但是当我单击选择框本身（包含选项的区域）时，第一次单击它时不会触发该事件（除非我之前单击了箭头）。当我第二次（以及之后的每次）单击选择框时，事件都会触发！

我尝试使用“onFocus”而不是“onClick”，它确实有效，但是第一次点击时下拉菜单不会打开，即使我使用“openDropDown”功能（连接到“点击“！）。

是我，我遇到了 Dojo 错误还是我没有得到的奇怪功能？任何帮助表示赞赏。

您好，选择0r

【问题讨论】：

可能调用 dataSelect.startup() 方法（在创建小部件之后）会解决这个问题？
嗯，我看到 dijit.form.Select 是一个旧的小部件。我尝试从 v 1.3（不带属性和选项）以编程方式创建 FilteringSelect 和 ComboBox，并且您的代码运行良好。
好的，我试试看。谢谢！

标签： forms select onclick dojo

【解决方案1】：

这是一个跨浏览器的解决方案：

var sizeSelect = new dijit.form.Select({
    id: "sizeSelect",
    name: "state",

    options: size,
    onChange: function(val) {
          dojo.style(dojo.byId("textInput"), {"fontSize":val});
    }
}, "sizeSelect");

【讨论】：

【解决方案2】：

尽量不要连接到小部件本身，而是连接到它的 dom 节点：

dojo.connect(dataSelect.domNode, "onclick", function() {
        alert("clicked!");
      });

【讨论】：

不幸的是，这不起作用。事实上，连接到 domnode 时根本不会触发任何事件。我还尝试用一个跨度包围选择并连接到该跨度的 onClick，但结果相似。
对不起，是 onclick 不是 onClick。并确保 domNode 在您连接到它时存在。
谢谢，我现在没有“onclick”和“onClick”在这一点上会有所作为。但不幸的是，使用“onclick”会导致与我之前的行为相同：第一次单击选择不会触发事件（而第一次单击箭头会触发），然后第二次单击有效。我看不出为什么第一次单击会有所作为，也许我应该在呈现后“激活”选择？无论如何，这对我来说越来越像 Dojo-bug...

【解决方案3】：

Select（扩展 _HasDropDown）有花哨的代码来处理：

鼠标按下选择小部件
鼠标移动到选项之一
鼠标上移

也许那是取消点击事件。

也许您可以改为连接到 _loadChildren()。

【讨论】：

"_loadChildren" 被触发太早而无法使用，因为我只想在必要时加载更多的孩子。但是“onMouseDown”（而不是“onClick”）成功了！打败我为什么，但现在下拉菜单的行为完全符合预期。我仍然认为这是一个 Dojo 错误，但知道如何摆脱它是件好事。非常感谢！！

【解决方案4】：

这个问题的根本原因是dijit._HasDropDown的_onDropDownMouseDown方法会操纵dom节点，导致第一次初始化时onmousedown和onmouseup的e.target发生变化。

众所周知，onclick事件只有在onmousedown和onmouseup的目标是同一个目标时才会触发。

所以在这种情况下，不会触发onclick事件。

似乎在 Dojo 1.5 中，问题仍然存在。

【讨论】：