Question

我尝试添加一个onChange事件，我想在每次在FilteringSelect上进行选择时触发，但它似乎没有触发。我试图让on函数中的动作既改变又改变onChange并且都不起作用。我尝试将onChange作为FilteringSelect的参数，但这也没有用。

我正在使用Dojo 1.10。

require(["dijit/form/FilteringSelect", "dojo/store/Memory", "dojo/dom", "dojo/on", "dojo/domReady!"],
  function(FilteringSelect, Memory, dom, on) {
    var filteringSelect = new FilteringSelect({
      id: "zoom",
      name: "zoom",
      value: "z",
      intermediateChanges: true,
      store: new Memory({
        data: [
          {name:"Zoom", value:"z"},
          {name:"50%", value:".5"},
          {name:"75%", value:".75"},
          {name:"100%", value:"1"},
          {name:"125%", value:"1.25"},
          {name:"150%", value:"1.5"},
          {name:"175%", value:"1.75"},
          {name:"200%", value:"2"}
        ]
      }),
      searchAttr: "name"
    }, "zoomDiv").startup();
    on(filteringSelect, 'change', function(value) {
      console.log(value);
    });
});

Answer 1

dijit/form/FilteringSelect作为一个奇怪的API。当用户在文本框中键入内容时，当您在为自动完成打开的列表中选择某些内容时会触发onChange，但当您从打开的使用下拉列表中选择列表中的某些内容时， NOT 按钮。

对于一致的事件，您可以观看属性displayedValue

require(["dijit/form/FilteringSelect", "dojo/store/Memory", "dojo/dom", "dojo/on", "dojo/domReady!"],
  function(FilteringSelect, Memory, dom, on) {
    var filteringSelect = new FilteringSelect({
      id: "zoom",
      name: "zoom",
      value: "z",
      intermediateChanges: true,
      store: new Memory({
        data: [{
          name: "Zoom",
          value: "z"
        }, {
          name: "50%",
          value: ".5"
        }, {
          name: "75%",
          value: ".75"
        }, {
          name: "100%",
          value: "1"
        }, {
          name: "125%",
          value: "1.25"
        }, {
          name: "150%",
          value: "1.5"
        }, {
          name: "175%",
          value: "1.75"
        }, {
          name: "200%",
          value: "2"
        }]
      }),
      searchAttr: "name"
    }, "zoomDiv");
    filteringSelect.startup();
    filteringSelect.watch('displayedValue', function(property, oldValue, newValue) {
      alert(property + ':' + newValue);
    });

  });

<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/resources/dojo.css"/>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit/themes/tundra/tundra.css"/>
 <div class="tundra">
<div id="zoomDiv"></div>
</div>

将onChange事件添加到Dojo FilteringSelect

1 个答案: