bootstrap中select控件无法动态加载option选项的问题

原本是这样写(节选主要部分):

<select id="cmbBrand"></select>

 var brand = $('#cmbBrand');
        brand.empty();
        brand.append("<option value='0'>请选择</option>");
        $.ajax({
            url: '/Teaching/Brand/GetBrandJson',
            type: "get",
            dataType: "json",
            success: function (data) {
                for (var i = 0; i < data.length; i++) {
                    brand.append("<option value='" + data[i].id + "'>" + data[i].text + "</option>");
                }
            }
        });
        brand.val("0");

会发现,所有option都没加上去,但是用alert来报for循环的生成项目,是有数据的!!但是option没添加上去...

反正用append来添加html,索性append到底:

<span id="spanBrand"></span>
$('#spanBrand').empty();    
  
$.ajax({ url: '/Teaching/Brand/GetBrandJson', 
type: "get", 
dataType: "json", 
success: function (data) 
{ 
	var strSelect = ""; 
	strSelect += "<select id='cmbBrand'>"; 
	strSelect += "<option value='0'>请选择</option>"; 
	for (var i = 0; i < data.length; i++) { 
		strSelect += "<option value='" + data[i].id + "'>" + data[i].text + "</option>"; 
	} 
	strSelect += "</select>";
	$('#spanBrand').append(strSelect); } 
}); 
建立一个空的span标签,再用ajax读取数据后,拼接一个完整的select标签的字符串(含所有选项option),最后append到span中去!成功!

猜你喜欢

转载自blog.csdn.net/djk8888/article/details/80451401