如何使用jQuery为HTML选择添加选项

时间:2018-01-28 18:11:22

标签: javascript jquery html

我有一个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
}));

这没有“数据组”,但是对每个选项都设置数据组非常重要,请举例说明我该怎么做?

3 个答案:

答案 0 :(得分:2)

您的代码有几个问题:

  1. 您没有正确使用字符串;字符串必须用引号括起来。
  2. 您在对象中使用连字符分隔的键,该键也必须用引号括起来,否则会出现语法错误。
  3. <强>代码:

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

答案 1 :(得分:0)

希望它有所帮助!

     $("#airports-sel").append("<option data-group=3 value='>Paris-Orly Airport</option>");

答案 2 :(得分:0)

您只需在jquery中编写以下代码即可添加选项。

$("#airports-sel").append("<option data-group='3' value='5'>Paris-Orly Airport</option>");