没有为下拉菜单调用 onChange 函数答案

【问题标题】：onChange function not getting invoked for dropdown menu没有为下拉菜单调用 onChange 函数
【发布时间】：2019-07-03 13:17:05
【问题描述】：

我有一个按钮，单击该按钮会将下拉菜单重置为其默认选项。

我有一个下拉菜单的 onchange 事件监听器。单击按钮时未触发事件侦听器。

HTML 代码

<select id="my_select">
    <option value="a">a</option>
    <option value="b">b</option>
    <option value="c">c</option>
</select>
<div id="reset">reset</div>

$("#reset").on("click", function () {
document.getElementById('my_select').selectedIndex = 0;
});
$("#my_select").change(function(){
alert("Hi");
});

点击 x 时不会触发上述更改代码，而手动更改时会触发。我希望它适用于 document.getElementById('Typess').selectedIndex = 1;也是。如何使这项工作？

【问题讨论】：

您能否提供更详细的代码示例？这是我们需要能够回答您的问题。
onchange 仅在用户进行更改时触发。我懒得找骗子了。

标签： javascript jquery html onclick onchange

【解决方案1】：

该事件change 被触发，因为用户对该元素进行了更改。

另一种方法是手动触发该事件，如下所示：

let $typess = $("#Typess")
$(".x").click(function(event) {
  document.getElementById('Typess').selectedIndex = 1;
  $typess.trigger("change");
})

$typess.on('change', function(event) {
  console.log("Changed");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="Typess">
<option>A</option>
<option>B</option>
</select>
<p>
<button class="x">Click me!</button>

【讨论】：

【解决方案2】：

试试这个：

    $(".x").click(function(event){
    // alert(" x is clicked") (This alert is working)
     document.getElementById('Typess').val(1);
    })

还要确保您确实更改了值，而不是尝试设置相同的值

【讨论】：

【解决方案3】：

尝试在click 中实现您的change 事件：

$("#reset").on("click", function () {
document.getElementById('my_select').selectedIndex = 0;

  $("#my_select").change(function(){
  alert("Hi");
  });
});

【讨论】：

【解决方案4】：

触发更改事件

$("#reset").on("click", function () {
document.getElementById('my_select').selectedIndex = 0;
$("#my_select").change()
});

【讨论】：