Question

当用户点击FilteringSelect中的X按钮时，是否可能触发事件。 X清除用户输入，但onChange事件不会触发。谢谢！

Answer 1

我假设你引用Internet Explorer在输入文本框中显示的X按钮。其他浏览器不显示此内容。 FilteringSelect使用常规输入框，因此您可以参考有关此问题的一般答案：Event fired when clearing text input on IE10 with clear icon

如您所见，有几种方法。您可以使用oninput事件来检查显示的值何时变为空字符串（因为用户单击了X按钮或者因为他按下退格键来删除最后一个字符）。在这种情况下，您不应该监视FilteringSelect本身，而是监视其内部文本框（如下例所示）。

还可以选择使用样式隐藏此X按钮：

.yourclass input[type=text]::-ms-clear  {
    display: none;
}

require([
    "dojo/store/Memory", "dijit/form/FilteringSelect", "dojo/on", "dojo/domReady!"
], function(Memory, FilteringSelect, on){
    var stateStore = new Memory({
        data: [
            {name:"Alabama", id:"AL"},
            {name:"Alaska", id:"AK"},
            {name:"American Samoa", id:"AS"},
            {name:"Arizona", id:"AZ"},
            {name:"Arkansas", id:"AR"},
            {name:"Armed Forces Europe", id:"AE"},
            {name:"Armed Forces Pacific", id:"AP"},
            {name:"Armed Forces the Americas", id:"AA"},
            {name:"California", id:"CA"},
            {name:"Colorado", id:"CO"},
            {name:"Connecticut", id:"CT"},
            {name:"Delaware", id:"DE"}
        ]
    });

    var filteringSelect = new FilteringSelect({
        id: "stateSelect",
        name: "state",
        value: "CA",
        store: stateStore,
        searchAttr: "name"
    }, "stateSelect");
    filteringSelect.startup();
  
    on(filteringSelect.textbox, "input", function(event) {
      if (filteringSelect.textbox.value == "")
      {
        window.alert("Cleared");
      }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<link href="https://ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/resources/dojo.css" rel="stylesheet"/>
<link href="https://ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit/themes/claro/claro.css" rel="stylesheet"/>
<div class="claro">
<input id="stateSelect">
</div>

单击“X”时要触发的dojo FilteringSelect事件

1 个答案: