HTML select 表格 - 如何 "trigger" 默认选项

Question

我发现了很多关于如何设置 HTML "select" 表单的有用示例。我在任何地方都找不到的是如何 "auto-trigger" 默认选项，而不必先从下拉列表中 "select" 它。

Answer 1

在 onload() 方法中执行此操作：

Var select = document.getElementsByName('fruit')[0];
select.value=1;
select.dispatchEvent(new Event('change'));

这将在页面加载时将所选选项更改为 1（或您想要的任何其他选项），并触发 onchange 事件，该事件将填充您的 table。

Answer 2

因为你已经为select元素定义了onchange事件，你可以调用.onchange()来触发select元素的onchange事件。

示例代码如下：

<form>
 <select name="fruit" onchange="showFruit(this.value)">
  <option>Choice:</option>    
  <option value="1">Yellow Fruit</option>
  <option value="2">Red Fruit</option>
 </select>
</form>

<script>
 window.onload = function () {
  var el = document.getElementsByName('fruit')[0];
  el.value = 1; //Set default value
  el.onchange(); //trigger onchange event
 }

 function showFruit(val) {
  alert(val);
 }
</script>

HTML select 表格 - 如何 "trigger" 默认选项

HTML select form - how to "trigger" default option

html

forms

jquery

onchange