jQuery如何實(shí)現(xiàn)動(dòng)態(tài)產(chǎn)生select option下拉列表

這篇文章給大家分享的是有關(guān)jQuery如何實(shí)現(xiàn)動(dòng)態(tài)產(chǎn)生select option下拉列表的內(nèi)容。小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考，一起跟隨小編過(guò)來(lái)看看吧。

但其中沒(méi)有實(shí)現(xiàn)動(dòng)態(tài)產(chǎn)生select option下拉列表。

在jQuery環(huán)境之下使用創(chuàng)建jQuery對(duì)象來(lái)實(shí)現(xiàn)動(dòng)態(tài)產(chǎn)生，那是很方便的事情。

 在數(shù)據(jù)庫(kù)中準(zhǔn)備一些數(shù)據(jù)：

存儲(chǔ)過(guò)程：

開(kāi)發(fā)ASP.NET MVC，實(shí)現(xiàn)程序，少不了model:

現(xiàn)創(chuàng)建一個(gè)實(shí)體Entity，即是與數(shù)據(jù)庫(kù)通訊：

接下來(lái)，你可以創(chuàng)建獲取數(shù)據(jù)集的方法，讓前端jQuery執(zhí)行的方法：

ok,一切準(zhǔn)備就緒。

創(chuàng)建一個(gè)select對(duì)象：

$selectCity = $('<select />').attr({ name: 'city', class: 'selectcity' });

你可以創(chuàng)建一個(gè)空的option:

$("<option></option>", { value: "", text: "" }).appendTo($selectCity);

從數(shù)據(jù)庫(kù)讀出來(lái)的數(shù)據(jù)，現(xiàn)可以動(dòng)態(tài)產(chǎn)生option:

如果你需要在顯示時(shí)，綁定一個(gè)選擇值，那怎樣實(shí)現(xiàn)呢？很簡(jiǎn)單的，在$.each時(shí)，判斷一下：

上面的“3”是一個(gè)變量，即是你需要綁定的值。下面是效果演示：

感謝各位的閱讀！關(guān)于“jQuery如何實(shí)現(xiàn)動(dòng)態(tài)產(chǎn)生select option下拉列表”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)，如果覺(jué)得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！