如何在每个具有相同ID的选择中添加选项

Question

我想在具有相同ID的选择中添加一个选项。

以下是我的html的样子

  <div>
    <select id="essai">
      <option>1</option>
      <option>2</option>
    </select>
    <select id="essai">
      <option>1</option>
      <option>2</option>
    </select>
  </div>

以下是我的html的样子，但它改变了第一个选择

$('#essai').append($('<option>my-option</option>'));

这是我想要的结果

  <div>
    <select id="essai">
      <option>1</option>
      <option>2</option>
      <option>my-option</option>
    </select>
    <select id="essai">
      <option>1</option>
      <option>2</option>
      <option>my-option</option>
    </select>
  </div>

你知道吗？ 感谢

Answer 1

id必须是唯一的。使用class执行此操作。使用$.each传递所有课程。

$.each($(".essai"), function(){
  $(this).append($('<option>my-option</option>'));
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
    <select class="essai">
      <option>1</option>
      <option>2</option>
    </select>
    <select class="essai">
      <option>1</option>
      <option>2</option>
    </select>
  </div>

Answer 2

将 ID 更改为类

$('.essai')会选择课程更改# ti .

. will let you select Class

＆＃13;

＆＃13;

$('.essai').append($('<option>my-option</option>'));

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
    <select class="essai">
      <option>1</option>
      <option>2</option>
    </select>
    <select class="essai">
      <option>1</option>
      <option>2</option>
    </select>
  </div>

＆＃13;

＆＃13;

＆＃13;

Answer 3

id 必须是唯一的。所以这里不使用id，你应该使用class。

$('.essai').append($('<option>my-option</option>'));

现在它将更新所有选项。

<div>
    <select class="essai">
      <option>1</option>
      <option>2</option>
      <option>my-option</option>
    </select>
    <select class="essai">
      <option>1</option>
      <option>2</option>
      <option>my-option</option>
    </select>
  </div>