如何以编程方式更改选择以触发其 onchange 行为？答案

【问题标题】：How do I programmatically change a select so that it fires its onchange behavior?如何以编程方式更改选择以触发其 onchange 行为？
【发布时间】：2009-08-03 21:30:20
【问题描述】：

这似乎不起作用：

<select id="mySel" onchange="alert('foo')">
    <option value="a">a</option>
    <option value="b">b</option>
</select>

<script>
dojo.byId('mySel').value = 'b'; // select changes, but nothing is alerted
</script>

（我正在使用dojo，但这并不重要。）

【问题讨论】：

可能重复。今天看到了。
我进行了搜索，但没有找到任何东西。
我正在寻找它。显然它的措辞不同......
我不得不争辩说，在这种情况下使用 dojo 确实很重要，因为您没有使用典型的 JavaScript 方式来更改下拉列表中的选定项目。您是否尝试过更改 mySel.selectedIndex？
也许这个：stackoverflow.com/questions/1219026/…

标签： javascript select onchange

【解决方案1】：

'onchange' 名称有点误导，除非您了解更改事件和正在更改的值不是一回事。当用户更改浏览器中的值时，会发生更改事件。不过，我相信您可以在以编程方式更改值后通过调用 dojo.byId('mySel').onchange() 手动触发事件。（不过，您可能需要实际定义一个调用 alert 的函数。我自己没有这样做。）

【讨论】：

【解决方案2】：

这将更改值但不会触发 onchange 事件。任何时候你用 JavaScript 修改元素都不会触发事件（阻止你陷入递归问题*）。

如果你像这样设置事件处理程序。

function myHandler(){
  //do whatever stuff here
  changeColor( dojo.byId('mySel') );
}

然后您可以在以编程方式设置值之后单独调用它。

注意 (*)：我不是道场专家...所以我假设他们没有“添加”在您从 JavaScript 设置值时自动调用事件处理程序。

【讨论】：

【解决方案3】：

适用于希望使用 javascript 触发 change 事件的任何人。

        var evObj = document.createEvent("HTMLEvents");
        evObj.initEvent("change", true, true);
        var elem = document.getElementById('some-id');
        elem.dispatchEvent(evObj);

【讨论】：

【解决方案4】：

您可以看看这些问题及其答案：它们可能会有所帮助：

Detect programmatical changes on a html select box.
How do I programatically force an onchange event on an input?（专注于输入，而不是选择，但可能仍然有用）

【讨论】：

【解决方案5】：

您可以访问事件“onpropertychange”，它在事件参数中包含一个属性，以识别更改了哪个属性。

它检测“selectedIndex”和“value”的变化——简单地测试“propertyName”

<select id="mySel" onpropertychange="dothis(event);">
    <option value="a">a</option>    
    <option value="b">b</option>
</select>

function dothis(event)
{

    if (event.propertyName == "selectedIndex")
            alert('selection changed');
}

没想到...（目前使用的 asp.net js 框架有点不同）

【讨论】：

【解决方案6】：

尝试分配 selectedIndex。

【讨论】：