淺析Jquery操作select
話不多說，請看代碼：
<select id="Select1"> <option value="one">一</option> <option value="two">二</option> <option value="thr">三</option> <option value="tho">四</option> </select>
注釋：
（1）給下拉框賦值：$("#Select1").val(“二”);這時已經(jīng)選中了 value是two的選項 ，通過$("#Select1")[0].selectedIndex或者$("#Select1").get(0).selectedIndex可以得到此時的索引是1，下拉框的索引是從0開始的
（2）通過設(shè)置屬性$("#Select1 option[value='two']").attr('selected',true);也可以設(shè)置選中 其實就是相當(dāng)于賦值
（3）得到選中值對應(yīng)的text：
1、通過值得到：$("#Select1 option[value='" + 值 + "']").text()或者$("#Select1").find("option[value='" + 值 + "']").text()
2、通過選中狀態(tài)得到：$("#Select1").find("option:selected").text()
（4）下拉框的級聯(lián)：
很多時候用到select的級聯(lián)，即第二個select的值隨著第一個select選中的值變化。這在jQuery中是非常簡單的。
如：$(".selector1").change(function(){
// 先清空第二個
$(".selector2").empty();
// 實際的應(yīng)用中，這里的option一般都是用循環(huán)生成多個了
var option = $("<option>").val(1).text("pxx");
$(".selector2").append(option);
});
（5）通過option中text的值 來選中相應(yīng)的option的值
var count = $("#Select1 option").length;
for (var i = 0; i < count; i++) {
if ($("#Select1").get(0).options[i].text == $(this).val()) {
$("#Select1").get(0).options[i].selected = true;
break;
}
}
Ps：jquer中去掉前后空格的方法：$.trim(值);
以上就是本文的全部內(nèi)容，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，同時也希望多多支持腳本之家！
相關(guān)文章
本篇文章主要是對jquery中g(shù)et和post的簡單實例進行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-02-02
這篇文章主要為大家詳細(xì)介紹了利用jquery制作簡易的員工信息添加與刪除，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
有些時候需要根據(jù)瀏覽器來寫樣式，所以要判斷一下瀏覽器類型，百度了一下，才知道JQuery有個方法直接判斷，并附上原生的js的判斷方法，分享給大家，有需要的小伙伴可以參考下。2015-05-05
本周公司技術(shù)講座輪到我了，準(zhǔn)備說說現(xiàn)在流行的jQuery，下面是概要提綱，關(guān)鍵是看custom.js，已上傳源碼，程序中“//##”是分段用的，大家可以根據(jù)每一段取消注釋，然后找到相應(yīng)的id或class名查看效果。2010-01-01
在Jquery中，$是JQuery的別名，所有使用$的地方也都可以使用JQuery來替換,下面為大家介紹下如何解決jquery中美元符號命名沖突問題2014-01-01
SimpleModal是一個輕量級的jQuery插件，它提供了一個模式對話框發(fā)展強大的接口。這篇文章主要介紹了jQuery simpleModal插件的使用，非常不錯，具有參考借鑒價值，對jquery simplemodal相關(guān)知識感興趣的朋友一起學(xué)習(xí)吧2016-08-08
這篇文章主要介紹了jquery高級編程的最佳實踐詳解,學(xué)習(xí)JQ的朋友一定需要這個，參考下吧2014-03-03
jQuery添加/改變/移除CSS類及判斷是否已經(jīng)存在CSS
正如標(biāo)題所言會用到removeClass移除CSS類、addClass添加CSS類、toggleClass添加或者移除CSS類，hasClass判斷是否已經(jīng)存在CSS2014-08-08
這篇文章主要為大家詳細(xì)介紹了jQuery實現(xiàn)下拉菜單滑動效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-08-08
本文給大家分享的是一則使用jQuery獲得內(nèi)容以及內(nèi)容的屬性的方法和示例，非常實用，推薦給大家。2015-02-02