bootstrap動態拼接下拉框

<div class="control-group">
			<label class="control-label">二級分類：</label>
			<div class="controls">
				<form:select path="subCategoryId" id="subCategoryId" class="input-medium">
                    <%-- <form:options items="${fns:getNavigationList(deskId)}" itemLabel="name" itemValue="id" htmlEscape="false"/> --%>
                </form:select>
			    <span class="help-inline"><font color="red">*</font> </span>
			</div>
		</div>
//動態調用賦值下拉框
function categoryChange(){
	    	var id = $("#categoryId").val();
            $("#subCategoryId").html('');
            $("#subCategoryId").val('');
            $.ajax({
                url : '${ctx}/categoryinfo/categoryInfo/getCategorySon',
                type : "post",
                data : {
                    id : id
                },
                cache : false,
                error : function() {
                },
                success : function(data) {
                    
                    var optionstr = "";
                    var va="";
                    var list = data.list;
                    if (list && list.length != 0) {
                        $.each(list, function(index, item) {
                            optionstr+="<option value=\""+item.id;
                            optionstr+="\"";
                            if(index==0){
                                optionstr += " selected=\"selected\" "; //默認選中
                                va=item.name;
                            }
                            optionstr+=" >"+item.name+ "</option>";
                         });
                        $("#subCategoryId").append(optionstr);
                    }
                    $("#s2id_subCategoryId span.select2-chosen").eq(0).text(va);
                }
            });
        }