📜  选择标签上的 onchange - Html (1)

📅  最后修改于: 2023-12-03 14:58:01.021000             🧑  作者: Mango

使用 onchange 属性选择标签上的事件

在 HTML 中,可以使用 onchange 属性来指定选择标签上的 onchange 事件。这个事件在元素的值改变时触发,而且通常与表单元素一起使用。

语法
<select onchange="myFunction()">
  <option value="value1">Value 1</option>
  <option value="value2">Value 2</option>
</select>

以上代码将会创建一个选择器,当选择器的选中项修改时,将会调用 JavaScript 函数 myFunction()

实例
<!DOCTYPE html>
<html>
<body>

<p>Select a car:</p>

<select onchange="myFunction()">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

<p id="demo"></p>

<script>
function myFunction() {
  var x = document.getElementById("mySelect").value;
  document.getElementById("demo").innerHTML = "You selected: " + x;
}
</script>

</body>
</html>

以上代码演示了如何创建一个选择器,当用户更改选择时,显示选中项的名称。

注意事项
  • onchange 仅适用于表单元素,例如 <input><select><textarea>
  • 在一些情况下(例如通过 JavaScript 更改 <select> 元素的值),修改值时不会触发 onchange 事件。

以上就是 onchange 属性选择标签上的事件的介绍,希望对你有所帮助!