如何防止onclick事件在select选项中触发

how to prevent onclick event to trigger in select option

本文关键字：选项 select 何防止 onclick 事件      更新时间：2023-09-26

我有一个选择，它在单击时触发事件。但我想防止它在单击相应选项时再次触发。

有办法做到这一点吗？

试试onchange怎么样。因此，如果所选内容没有变化。不会触发任何内容。

只需使用onchange事件。以下是一个示例：https://jsfiddle.net/rafb0vyw/2/

$('#sel').on('change', function() {
    alert('change');
})

您可以检查event.target属性，该属性将具有不同的值。像这样：

var select = document.querySelector('select');
var span = document.querySelector('span');
select.onclick = function(e) {
    // show e.target in snippet (you would remove this line in your code):
    span.textContent = 'You clicked on ' + e.target.tagName + '.' +
         ' Current selected value is ' + select.value;
    if(e.target.tagName !== 'SELECT') return; // ignore
    // The rest of your event handling comes here...
    // This will only be executed when you click the SELECT and not the OPTION.
};
<select>
     <option value = 'A'>Option A</option>
     <option value = 'B'>Option B</option>
</select>
<span></span>

请确保在事件处理程序函数中定义了事件参数（在上面的示例中命名为e）。

相关文章：