0

我有一个从数据库获取值的页面，我无法控制这些值/它们的调用方式，但最终结果看起来像标准 HTML 代码，例如：

<div id="myDiv" class="controls">
    <select id="jform_province" name="jform[province]">
        <option value="AB">Alberta</option>
        <option value="BC">British Columbia</option>
        <option value="MB">Manitoba</option>
    </select>
</div>

我希望在页面末尾放置一个脚本，该脚本可以通过添加一个函数来修改选项元素，因此它看起来像这样：

<option value="AB" onClick="someFunction()">Alberta</option>

如何修改代码？我知道如何编辑 div 的全部内容，但我想更改元素，我不知道元素的值是什么，所以脚本需要在“myDiv”中找到所有选项标签（我在我不想更改的页面）并将该代码添加到所有这些中。

谢谢

4

1 回答 1

2

只需附加一个事件处理程序：

document.getElementById('jform_province').onchange = function() {
  switch(this.options[this.selectedIndex].value) {
    case "AB": someFunction(); break;
    // define other cases as needed
  }
};

请注意，<option>元素在被选中时不会触发onclick事件，即使它们触发了，它也不会检测到其他输入方法，例如使用键盘。上面的代码提供了另一种选择。

于 2013-02-04T22:55:02.047 回答