Question

有默认选择框（第一个选择框）

选择一些选项

使用$ .post发送到外部php并根据所选选项（值），从mysql获取下一个选择框

将下一个选择框添加到第一个选择框

问题是第一个选择框不保留/保留选定的选项

这是代码（而不是$ .post和外部php我只是定义包含下一个选择框的jquery变量）

Html

<span id="span_topics">

<select class="topics" id="0" style="width:135px;">
<option value="">Select</option>
<option value="1">0_One</option>
<option value="2">0_Two</option>
</select>    

</span>

和jquery

$(document).on('change', '.topics', function(){

id_of_selected_class = this.id;
closest_upper_level_id = $(this).val();

alert('here can see selected option');    
var selected_option = $('#' + id_of_selected_class).find(":selected").val();
$('#' + id_of_selected_class + ' option').prop('selected', false) .filter('[value="' + selected_option + '"]') .prop('selected', true);
alert('here can see selected option');

var topic_names = '<select class="topics" id="1" style="width:135px;"><option value="">Select</option><option value="1">1_One</option><option value="2">1_Two</option></select>';

alert( $("#span_topics").html() );
//In alert i can not see selected option; How to get to see?    
$("#span_topics").html( $("#span_topics").html() + topic_names );    
alert('but here can NOT see selected option');    

});

以下是示例http://jsfiddle.net/dr66bmcm/7/

例如，如果id="0"我选择了<option value="1">0_One</option>，那么在为id="0"执行jquery后，我会看到<option value="">Select</option>。如何保留/保留以查看<option value="1">0_One</option>？

Answer 1

而不是改变整个html：

$("#span_topics").html( $("#span_topics").html() + topic_names );

将新数据附加到现有的html：

$("#span_topics").append(topic_names);

Answer 2

试试这个

Demo

   $('#' + id_of_selected_class + ' option').prop('selected', false) .filter('[value="' + selected_option + '"]').attr("selected","selected");;
    alert('here can see selected option');

jquery保留/保留第一个选择框的选定选项，当我下一个选择框时

2 个答案: