javascript 如何在单击选择中的选项后触发事件？

7xzttuei 于 2023-04-10 发布在 Java

关注(0)|答案(1)|浏览(102)

我正在尝试设置一个测试函数，当用户单击<select>元素中的特定选项时，会显示一个警报：

<script>
function test() {
    var body = document.getElementById("body");
    var select = document.createElement("select");
    var defaultOpt = document.createElement("option");
    defaultOpt.label = "Default Option";
    var mainOpt = document.createElement("option");
    mainOpt.label = "Click this option";

    mainOpt.onClick = alert("It works!");

    select.appendChild(defaultOpt);
    select.appendChild(mainOpt);
    body.appendChild(select);
}
</script>

<body id="body">
    <input type="button" value="Start" onclick="test();" />
</body>

但是，只有当我点击“开始”按钮时，警报才会显示，而不是当我点击选择中的指定选项时。有人能告诉我如何正确设置吗？

JavaScript

来源：https://stackoverflow.com/questions/22276604/how-to-fire-an-event-after-clicking-an-option-in-a-select

1条答案

按热度按时间

mwkjh3gx1#

您可以使用selectElement.onchange事件。这可能需要您的选择元素失去焦点，在一些较旧的浏览器中，以触发事件。

//<![CDATA[
// common.js
var doc = document, bod = doc.body, IE = parseFloat(navigator.appVersion.split('MSIE')[1]);
bod.className = 'js';
function gteIE(version, className){
  if(IE >= version)bod.className = className;
}
function E(e){
  return doc.getElementById(e);
}
//]]>

//<[CDATA[
// yourpage.js
function test(){
  var sel = doc.createElement('select'), defaultOpt = doc.createElement('option');
  var mainOpt = doc.createElement('option');
  defaultOpt.value = defaultOpt.label = 'Default Option';
  mainOpt.value = mainOpt.label = 'Click this option';
  sel.appendChild(defaultOpt); sel.appendChild(mainOpt);
  sel.onchange = function(){
    if(this.value === defaultOpt.value){
      alert('It Works!');
    }
  }
  bod.appendChild(sel);
}
test();
//]]>

或者只是注意JavaScript事件应该是小写的。注意你有onClick，它应该是onclick。此外，要运行这样的警报，你应该把它放在一个匿名函数中，比如：

mainOpt.onclick = function(){
   alert('It Works!');
 }

赞(0）回复(0）举报 2023-04-10

我来回答

javascript 如何在单击选择中的选项后触发事件？

1条答案

相关问题

热门标签

最新问答