如何通过javascript将onchange事件添加到选择框？答案

【问题标题】：How to add an onchange event to a select box via javascript?如何通过javascript将onchange事件添加到选择框？
【发布时间】：2010-12-10 08:57:00
【问题描述】：

我有一个脚本，我可以在其中动态创建选择框。创建这些框后，我们希望将新框的onchange 事件设置为指向名为toggleSelect() 的函数。

我似乎无法正确创建onchange 事件的语法。有人可以告诉我我做错了什么吗？它不会抛出错误，但也不起作用。

  col = dataRow.insertCell(0);
  var transport_select = document.createElement('select');
  transport_select.id = transport_select_id;
  transport_select.options[0] = new Option('LTL', 'LTL');
  transport_select.options[1] = new Option('FTL', 'FTL');
  transport_select.onChange = function(){toggleSelect(transport_select_id);};
  col.appendChild(transport_select);

【问题讨论】：

标签： javascript dom-events

【解决方案1】：

添加

transport_select.setAttribute("onchange", function(){toggleSelect(transport_select_id);});

setAttribute

或尝试将onChange 替换为onchange

【讨论】：

谢谢！将其从“onChange”更改为“onchange”修复了它。
已知某些版本的 IE 在 setAttribute 方面存在问题，因此 transport_select.onchange = function(){...} 方法似乎更安全；)

【解决方案2】：

这是基于W3C DOM Level 2 Events Specification 附加事件的另一种方式：

  transport_select.addEventListener(
     'change',
     function() { toggleSelect(this.id); },
     false
  );

【讨论】：

【解决方案3】：

替换：

transport_select.onChange = function(){toggleSelect(transport_select_id);};

与：

transport_select.onchange = function(){toggleSelect(transport_select_id);};

on'C'hange >> on'c'hange

你也可以使用addEventListener。

【讨论】：

更一般地用于获取选项值或 id：select_element.onchange = function(){console.log(this.id + ": " + this.value);};

【解决方案4】：

如果您使用的是prototype.js，那么您可以这样做：

transport_select.observe('change', function(){
  toggleSelect(transport_select_id)
})

这消除了（希望）跨浏览器

中的问题

【讨论】：

【解决方案5】：

yourSelect.setAttribute( "onchange", "yourFunction()" );

【讨论】：

您好，欢迎来到 SO！你需要描述你的答案。此外，您需要回答问题本身。 user77413 正在询问“如何通过 javascript 将 onchange 事件添加到选择框？”并且还在他们的帖子中询问“有人可以告诉我我做错了什么吗？”。您需要在回答中解决这些问题。
这个答案简短而有效。
这是唯一对我有用的答案。
yourSelect.setAttribute( "onchange", "yourFunction(this)" ); 会更好