根据ajax响应的结果在下拉菜单中自动选择一个选项[重复]

Posted 2023-02-22

【中文标题】根据ajax响应的结果在下拉菜单中自动选择一个选项[重复]

【英文标题】：Auto selecting an option in a drop-down menu based on the result of an ajax response [duplicate]

【发布时间】：2020-03-16 13:35:22

【问题描述】：

我正在尝试打开一个包含下拉选择菜单的表单，并且已经根据来自 ajax 调用的响应选择了该选项。 根据我的阅读，我应该使用以下代码根据 ajax 响应在下拉列表中选择选项。我已经使用prop('selected', true 尝试了各种组合，但我没有尝试过。

$('#EditRoomOverrideRoom option').val(result[2]).prop('selected', true);

我的下拉菜单：

<select size="1" name="EditRoomOverrideRoomSelect" class="input-field" id="EditRoomOverrideRoom" required>

do 

<option value="<?php echo $row_MultiRoomSelect['ConfRoomID']?>"><?php echo $row_MultiRoomSelect['ConfRoomName']?></option>

 while ($row_MultiRoomSelect = mysql_fetch_assoc($MultiRoomSelect));
$rows = mysql_num_rows($MultiRoomSelect);
if($rows > 0) 
mysql_data_seek($MultiRoomSelect, 0);
$row_MultiRoomSelect = mysql_fetch_assoc($MultiRoomSelect);


</select>

可能 ajax 响应：

success: function(data)
    var result = JSON.stringify(data);
    result = JSON.parse(result);
    console.log("RESULT", result);
    var recordid = result[0];
    $('#EditRoomOverrideRecordID').val(result[0]);
    $('#EditRoomOverrideRoomID').val(result[1]);
    $('#EditRoomOverrideRoom option').val(result[2]).prop('selected', true);
    $('#EditRoomOverrideClientName').val(result[3]);
    $('#EditRoomOverrideFromDate').val(result[4]);
    $('#EditRoomOverrideFromTimeH').val(result[5]);
    $('#EditRoomOverrideFromTimeM').val(result[6]);
    $('#EditRoomOverrideToDate').val(result[7]);
    $('#EditRoomOverrideToTimeH').val(result[8]);
    $('#EditRoomOverrideToTimeM').val(result[9]);
    $('#EditRoomOverrideCompanyImage').val(result[10]);
    var imagepath = '../../../../conf/conf_images/roomoverride/'+ hotelid +'/'+ result[10];
    //$("#EditRoomOverrideCompanyImage").attr("src",imagepath);
    $("#EditRoomOverridePreview").attr("src",imagepath);
    $('#EditRoomOverrideFullBoardRoom').val(result[10]);

我哪里出错了？

【参考方案1】：

您不需要在 jquery 选择器上指定 option 元素或在 select 元素上调用 prop('selected', true)，只使用 .val()

<select id="mySelect">
    <option value="opt1">Opt 1</option>
    <option value="opt2">Opt 2</option>
    <option value="opt3">Opt 3</option>
</select>

$('#mySelect').val('opt2');

请记住，通过参数传递给.val() 的值必须是select 元素内的有效option