主页 / 问题 / 1533933
Accepted
Pavel
Asked:2023-08-03 16:49:51 +0000 UTC2023-08-03 16:49:51 +0000 UTC

单击表单中的选项时如何创建事件？

  • 772

我不明白如何在单击选项时创建事件。我写了下面的代码，但它不起作用。

document.addEventListener('click', e => {
    if (e.target.getAttribute('id') === 'selectSeria') alert("SEND");
})
<div class="form-group">
    <label for="exampleFormControlSelect1"></label>
    <select class="form-control" value="Модель"  name="custom" >
      <option class="js-button" value="16" id="selectSeria">Ventura HRL</option>
      <option class="js-button"></option>
      <option id="selectSeria3">3</option>
      <option>4</option>
      <option>5</option>
    </select>
  </div>

</form>

javascript

2 个回答

  1. Best Answer

    试试这个，指定 id：

    <select class="form-control" value="Модель"  name="custom" id="mySelect">

    代码：

    var select = document.getElementById('mySelect');
select.addEventListener('change', function() {
  console.log(select.value)
  
});

    https://codepen.io/exordio/pen/PoxVyvp

    • 2

  2. 我不明白如何在单击选项时创建事件。

    因此，没有与此相关的事件...但是您可以捕捉到 的变化select。虽然重复选择相同的值不会被拦截。

    document.addEventListener('change', e => {
  const o = e.target
  if (o.tagName != 'SELECT') return
  const oo = o.options[o.selectedIndex]
  if (oo.id === 'selectSeria') alert("SEND");
})
    <div class="form-group">
  <label for="exampleFormControlSelect1"></label>
  <select class="form-control" value="Модель" name="custom">
    <option class="js-button" value="16" id="selectSeria">Ventura HRL</option>
    <option class="js-button"></option>
    <option id="selectSeria3">3</option>
    <option>4</option>
    <option>5</option>
  </select>
</div>

    • 1

相关问题