這篇文章主要介紹了jquery怎么實現(xiàn)下拉選擇不同顯示不同的相關(guān)知識，內(nèi)容詳細(xì)易懂，操作簡單快捷，具有一定借鑒價值，相信大家閱讀完這篇jquery怎么實現(xiàn)下拉選擇不同顯示不同文章都會有所收獲，下面我們一起來看看吧。

創(chuàng)新互聯(lián)公司是專業(yè)的佛山網(wǎng)站建設(shè)公司，佛山接單;提供網(wǎng)站設(shè)計、網(wǎng)站建設(shè),網(wǎng)頁設(shè)計,網(wǎng)站設(shè)計,建網(wǎng)站,PHP網(wǎng)站建設(shè)等專業(yè)做網(wǎng)站服務(wù);采用PHP框架,可快速的進(jìn)行佛山網(wǎng)站開發(fā)網(wǎng)頁制作和功能擴(kuò)展;專業(yè)做搜索引擎喜愛的網(wǎng)站,專業(yè)的做網(wǎng)站團(tuán)隊,希望更多企業(yè)前來合作!

下面步驟介紹了如何從數(shù)據(jù)庫獲取數(shù)據(jù)，并動態(tài)的在前端顯示。

步驟一：jsp頁面靜態(tài)的select：

選擇A

選擇B

選擇C

注意：

1、靜態(tài)的select在某些場景下使用是沒有問題的。但是在產(chǎn)品不同的需求時，動態(tài)select更能勝任其多樣性。

2、select有多種寫法，這里是最簡單的。

步驟二：jQuery通過ajax請求獲取動態(tài)的數(shù)據(jù)，并在jsp頁面顯示。

function IninDepart（）{

$（"#selectSM"）。remove（）;//清空select列表數(shù)據(jù)

var state=1;

$.ajax（{

type : "POST",

url : "/getItemDepartList.do",

dataType : "JSON",

data : {},

success : function（msg）

{

$（"#selectSM"）。prepend（"請選擇"）;//添加第一個option值

for （var i=0; i < msg.rows.length; i++） {

//如果在select中傳遞其他參數(shù)，可以在option 的value屬性中添加參數(shù)

//$（"#selectSM"）。append（""+msg.rows[i]+""）;

$（"#selectSM"）。append（""+msg.rows[i]+""）;

}

},error:function（）{

alertLayer（"獲取數(shù)據(jù)失敗","error"）;

}

}）;

}

注意：這里使用的是jQuery、ajax，其他方式也可以實現(xiàn)。

步驟三：后臺數(shù)據(jù)的處理。

public JSONObject getItemDepartList（HttpServletRequest request） throws Exception{

//查詢select數(shù)據(jù)

List> list=appServices.getAppList（）;

System.out.println（"list::::::::" + list）;

//獲取數(shù)據(jù)存放到數(shù)組

String[] depart=null;

for （Map map : list） {

for （String k : map.keySet（）） {

depart=（（String） map.get（k））。split（","）;

System.out.println（"depart::::::::" + depart）;

}

}

//去除數(shù)組中重復(fù)數(shù)據(jù)，存放到list

List strList=new ArrayList（）;

for （int i=0; i

if（！strList.contains（depart[i]）） {

strList.add（depart[i]）;

}

}

System.out.println（"strList::::::::" + strList）;

jsonObject.put（"rows", strList）;

return jsonObject;

}

注意：由于后臺返回數(shù)據(jù)的問題，需要對數(shù)據(jù)進(jìn)行截取并去除重復(fù)數(shù)據(jù)。如果沒有這個需求，可以直接向前端返回一個數(shù)組或list即可。

關(guān)于“jquery怎么實現(xiàn)下拉選擇不同顯示不同”這篇文章的內(nèi)容就介紹到這里，感謝各位的閱讀！相信大家對“jquery怎么實現(xiàn)下拉選擇不同顯示不同”知識都有一定的了解，大家如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。