<div style="position:relative;">
    <span style="margin-left:100px;width:18px;overflow:hidden;">
    <select id="change" name="property" style="width:118px;margin-left:-100px" onchange="this.parentNode.nextSibling.value=this.value">
    </select></span><input name="box" style
 
="width:100px;position:absolute;left:0px;">
</div>

在載入select前的方法中從後臺讀取資料，並給select 賦予option值。

//這個方法需要在顯示select之前呼叫。
function getModelList3(){  ----一個的select框(第一級的框)
        var pid = $("#categoryId").val();
        console.log(pid);
        $("select[name=property]").empty();     //清空seletct的資料  
 

        $.ajax({
            type:"POST",                        //post請求
            url:"url",                          //請求後臺action 根據需求請求自己的後臺資料
            data:{"pid":pid},                   //傳到後臺的引數，後臺需要編寫get和set方法且和返回資料名相同。
            dataType:"json",                    //預期伺服器返回的資料型別
            error:function
 
(){                   //ajax錯誤的方法
            },   
            success:function(data){             //ajax成功的方法 在裡賣弄給select的<option>標籤賦值
                //向select中append、option標籤
                var optionString = "<option grade=\'請選擇一級屬性\' selected = \'selected\'>--請選擇一級屬性--</option>";
                var beanList = data;            //返回的json資料
                if(beanList){                   //判斷
                    for(var i=0; i<beanList.length; i++){ //遍歷，動態賦值
                        optionString +="<option grade=\""+beanList[i].id+"\" value=\""+beanList[i].id+"\"";  
                        optionString += ">"+beanList[i].name+"</option>";  //動態新增資料  
                    }  $("select[name=property]").append(optionString);  // 為當前name為asd的select新增資料。
                }  
            }  
        });  
    } 

在前面select的onchange屬性，表示在切換下拉框值得時候呼叫的方法，上面表示的是，給select上面的input賦值（為了實現可編輯的下拉框）。

可修改成：

onchange="this.parentNode.nextSibling.value=this.value;gradeChange()"

這裡的gradeChange()方法寫在js裡面，實現在點選完成後可以得到當前選中的值：

$("#change").find("option:selected").text();//得到當前選中的值

我在option標籤中添加了grade屬性，用來體現name所對應的id值，其實可以直接用value檢視id值

function gradeChange(){
        var objS = document.getElementById("change");
        var grade = objS.options[objS.selectedIndex].getAttribute('grade');//這裡要是把grade換成value也是一樣的。
        $("#shuxingadd4").css("display","none");
        //取到select的值
        $("#change").find("option:selected").text();//取select的值
        $("#box").val();//取input輸入框的值
    }

本人進行的是單表多層新增操作，使用了四個層級的下拉框，在次新增需要清空之前的select資料
新增完成後可以在後面把select的資料清空
$(“#change”).empty(); //清空select的值

Tip：本文為個人在需求層面設計。