javascript - <option> 值未设置

Question

我有一个 ajax 调用返回的数据，我正在为每个返回的数据行创建一个选项(下拉选择)元素，我需要根据文本默认选择其中一个。但是值(value)没有分配给我“选择”的那个。下面是我的代码:

$.each(JSON.parse(r.d), function (key, value) {
  if (value == 'Username') {
    $('#ddlcriteria1')
      .append($('<option selected="selected">', { value: key })
        .text(value));
  }
  else {
    $('#ddlcriteria1')
      .append($('<option>', { value: key })
        .text(value));
  }
});

我正在为每个返回的行添加一个选项元素，并将默认选择的元素设为“用户名”。添加后查看 DOM 时。我看到了这个:

  <option value="1">First Name</option>
  <option value="2">Last Name</option>
  <option selected="selected">Username</option>
  <option value="4">Email</option>
  <option value="8">Department</option>
  <option value="9">Status</option>
  <option value="10">Position</option>
  <option value="11">Role</option>
  <option value="12">User Group</option>
  <option value="13">Course Code</option>
  <option value="15">Enrollment Location</option>
  <option value="16">Organization</option>

带有“用户名”文本的选项元素没有分配值，知道为什么会这样吗？

Answer 1

同时在对象中设置selected 属性，如下所示:

$('<option>', { value: key, selected: true })