使用Javascript动态设置"selected"属性

Question

这是我的代码:

$.ajax({   
    type: "POST",
    url: "localhost/api.php",
    data: {id:user_id},
    cache: false,
    success: function(data) {

        var obj = $.parseJSON(data); 
        if (obj.msg == "1")
        {
            $.each(obj.userList, function(i,value) {
                var jArray = <?php echo json_encode($groupData ); ?>;
                list = [];
                for (var i = 0; i < jArray.length; i++) {
                    list.push('<option id=' + jArray[i].Group_Id + ' value=' + jArray[i].Group_Name + '>' + jArray[i].Group_Name + '</option>');
                }
                var html ="<tr>"+
                        "<td>"+value['id']+"</td>"+
                        "<td>"+value['groupID']+"</td>"+ 
                        "<td><select name='Group[]''>"+list+ "</select></td>";
                $('table#List tbody').append(html);

            });
        }
    },
    alert('Error');
});

我正在基于ajax响应动态构建html.在代码段>中

 var jArray = <?php echo json_encode($groupData ); ?>;
 list = [];
 for (var i = 0; i < jArray.length; i++) {
      list.push('<option id=' + jArray[i].Group_Id + ' value=' + jArray[i].Group_Name + '>' + jArray[i].Group_Name + '</option>');
 }

$groupData是一个PHP数组.所以我将它转换为Javascript数组并使用它jArray来生成"选项"并推送结果列表数组.我将这个list数组附加到html中,这很有效.现在有6个组,其中一个已经为数据库中的特定用户设置.所以目前没有一个"选项"选择了属性.我有在比较麻烦jArray[i].Group_Id用value['groupID'].我想要实现的是我想要比较jArray[i].Group_Id,value['groupID']如果它们相等,那么将选定的属性设置为该特定.如何if在"选项"中为比较编写声明？

Answer 1

以下是一些显示此工作的示例代码:

const jArray = [{Group_Id: 1, Group_Name: 'One'}, {Group_Id: 2, Group_Name: 'Two'}];
const userList = [{id: 'user1', groupID: 2}, {id: 'user2', groupID: 2}, {id: 'user3', groupID: 1}];
$.each(userList, function(x,value) {
  list = [];
  for (var i = 0; i < jArray.length; i++) {
    list.push('<option id=' + jArray[i].Group_Id + ' value=' + jArray[i].Group_Name + (jArray[i].Group_Id == value.groupID ? ' selected ' : '') + '>' + jArray[i].Group_Name + '</option>');
  }
  var html ="<tr>"+
      "<td>"+value.id+"</td>"+
      "<td>"+value.groupID+"</td>"+ 
      "<td><select name='Group[]''>"+list+ "</select></td>";
  $('table#List tbody').append(html);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="List">
  <tbody></tbody>
</table>

您的代码中缺少的重要部分是:

(jArray[i].Group_Id == value.groupID ? ' selected ' : '')