javascript - 如何使用 jQuery 添加选项到 HTML 选择

Question

我有一个 html 选择，例如:

<select id="airports-sel">
      <option data-group="1" value="1">Madrid–Barajas</option>
      <option data-group="1" value="2">Torrejón de Ardoz Airport</option>
      <option data-group="2" value="3">Milan-Malpensa</option>
      <option data-group="2" value="4">Milan-Linate</option>
</select>

我需要使用 jQuery 添加一个新机场到此选择，我尝试使用以下代码，但它不起作用:

$('#airports-sel').append($('<option>', {
      value: 5,
      text: Paris-Orly Airport,
      data-group: 3
}));

这不需要“数据组”，但对我来说在每个选项上设置数据组非常重要，您能否提供一个示例来说明如何做到这一点？

Answer 1

您的代码有几个问题:

1. 您没有正确使用字符串；字符串必须用引号引起来。
2. 您在对象中使用连字符分隔的键，该键也必须用引号引起来，否则会出现语法错误。

代码:

$('#airports-sel').append($('<option>', {
      value: 5,
      text: "Paris-Orly Airport",
      "data-group": 3
}));