SpringMVC做二級聯(lián)動
<select id="myCol" onchange="getChange()">
<option value="1">
大連交大
</option>
<option value="2">
東北財經(jīng)
</option>
<option value="3">
大連海事
</option>
</select>
<select id="myGet">
</select>
<script type="text/javascript" >
function getChange() {
//獲取到第一個select表單value值
var myCol = document.getElementById("myCol").value;
//拼接成要獲取值的url
var url = "getCateGory?myCol=" + myCol; //url
//利用jquery的ajax方法,使用此方法要引jquery包
htmlobj = $.ajax( {
url : url,
async : false
});
//此處利用json處理值,還需要引json包,在服務(wù)器端可以使用GSON轉(zhuǎn)化數(shù)據(jù),響應(yīng)當(dāng)前頁面
/*服務(wù)器端:
//需要引GSON包
//創(chuàng)建一個Gson對象
Gson gson = new Gson();
//返回一個json格式的字符串
String pStr = gson.toJson(user);
System.out.println(pStr);
out.print(pStr);
*/
//接取響應(yīng)值,并且轉(zhuǎn)化成JSON對象
var obj = JSON.parse(htmlobj.responseText);
//此變量是為拼接而做
var options = "";
var myGet = document.getElementById("myGet");
//myGet.removeChild("option");
//刪除現(xiàn)有option節(jié)點
for ( var i = 1; i <= myGet.length; i++) {
myGet.remove(i);
}
myGet.remove(myGet.selectedIndex);
//利用循環(huán),在此將新的option添加上
for(var i=0;i<obj.length;i++){
alert(obj[i].uUserName);
var myOption=document.createElement("option");
myOption.setAttribute("value",obj[i].uId);
var testN=document.createTextNode(obj[i].uUserName);
myOption.appendChild(testN);
myGet.appendChild(myOption);
//此種方法最簡單,但是沒有技術(shù)含量
//options+="<option value='"+obj[i].uId+"'>"+obj[i].uUserName+"</option>";
}
// myGet.innerHTML=options;
}
</script>
posted on 2013-04-12 15:30 何云隆 閱讀(3922) 評論(0) 編輯 收藏 所屬分類: JS 、java 、Jsp 、AJAX 、Spring MVC