jquery控制select的text/value值為選中狀態(tài)
更新時(shí)間：2014年06月03日 09:07:17 作者：
這篇文章主要對(duì)jquery控制select的text/value值為選中狀態(tài)做下總結(jié)，省的每次使用都要到網(wǎng)上翻下
每一次操作select的時(shí)候，總是要在網(wǎng)上翻下，太繁瑣了，自己在這里總結(jié)下。
比如<select class="selector"></select>
1、設(shè)置value為“全部“的項(xiàng)選中
$(".selector").val("全部");
2、設(shè)置text為“全部“的項(xiàng)選中
$(".selector").find("option[text='全部']").attr("selected",true);
這里有一個(gè)中括號(hào)的用法，中括號(hào)里的等號(hào)的前面是屬性名稱(chēng)，不用加引號(hào)。很多時(shí)候，中括號(hào)的運(yùn)用可以使得邏輯變得很簡(jiǎn)單。
3、獲取當(dāng)前選中項(xiàng)的value
$(".selector").val();
4、獲取當(dāng)前選中項(xiàng)的text
$(".selector").find("option:selected").text();
這里用到了冒號(hào)，掌握它的用法并舉一反三也會(huì)讓代碼變得簡(jiǎn)潔。
很多時(shí)候用到select的級(jí)聯(lián)，即第二個(gè)select的值隨著第一個(gè)select選中的值變化。這在jquery中是非常簡(jiǎn)單的。
如：
$(".selector1").change(function(){
// 先清空第二個(gè)
$(".selector2").empty();
// 實(shí)際的應(yīng)用中，這里的option一般都是用循環(huán)生成多個(gè)了
var option = $("<option>").val(1).text("pxx");
$(".selector2").append(option);
});
比如<select class="selector"></select>
1、設(shè)置value為“全部“的項(xiàng)選中
復(fù)制代碼 代碼如下:
$(".selector").val("全部");
2、設(shè)置text為“全部“的項(xiàng)選中
復(fù)制代碼 代碼如下:
$(".selector").find("option[text='全部']").attr("selected",true);
這里有一個(gè)中括號(hào)的用法，中括號(hào)里的等號(hào)的前面是屬性名稱(chēng)，不用加引號(hào)。很多時(shí)候，中括號(hào)的運(yùn)用可以使得邏輯變得很簡(jiǎn)單。
3、獲取當(dāng)前選中項(xiàng)的value
復(fù)制代碼 代碼如下:
$(".selector").val();
4、獲取當(dāng)前選中項(xiàng)的text
復(fù)制代碼 代碼如下:
$(".selector").find("option:selected").text();
這里用到了冒號(hào)，掌握它的用法并舉一反三也會(huì)讓代碼變得簡(jiǎn)潔。
很多時(shí)候用到select的級(jí)聯(lián)，即第二個(gè)select的值隨著第一個(gè)select選中的值變化。這在jquery中是非常簡(jiǎn)單的。
如：
復(fù)制代碼 代碼如下:
$(".selector1").change(function(){
// 先清空第二個(gè)
$(".selector2").empty();
// 實(shí)際的應(yīng)用中，這里的option一般都是用循環(huán)生成多個(gè)了
var option = $("<option>").val(1).text("pxx");
$(".selector2").append(option);
});
您可能感興趣的文章:
- jQuery獲取select選中的option的value值實(shí)現(xiàn)方法
- jQuery獲取checkboxlist的value值的方法
- Jquery使用val方法讀寫(xiě)value值
- jQuery對(duì)val和atrr("value")賦值的區(qū)別介紹
- jQuery操作select下拉框的text值和value值的方法
- Jquery遍歷checkbox獲取選中項(xiàng)value值的方法
- jquery如何通過(guò)name名稱(chēng)獲取當(dāng)前name的value值
- jQuery獲取Radio,CheckBox選擇的Value值(示例代碼)
- jquery 根據(jù)name名獲取元素的value值
- jQuery操作value值方法介紹
相關(guān)文章
jquery點(diǎn)擊獲取動(dòng)態(tài)數(shù)據(jù)進(jìn)行傳參問(wèn)題
這篇文章主要介紹了jquery點(diǎn)擊獲取動(dòng)態(tài)數(shù)據(jù)進(jìn)行傳參問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-12-12
jQuery實(shí)現(xiàn)動(dòng)畫(huà)效果的簡(jiǎn)單實(shí)例
本篇文章主要是對(duì)jQuery實(shí)現(xiàn)動(dòng)畫(huà)效果的簡(jiǎn)單實(shí)例進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-01-01
JSON(JavaScript Object Notation)javscript對(duì)象標(biāo)記，是一種輕量級(jí)的數(shù)據(jù)交換格式。具體的詳細(xì)基礎(chǔ)知識(shí)可以參考JSON官網(wǎng)http:/www.json.org/。不說(shuō)太多廢話，直接說(shuō)說(shuō)我對(duì)JSON的理解吧。2014-11-11
使用過(guò)Prototype.js的同學(xué)知道$(xx)調(diào)用后返回的是HTMLElement或其集合。2011-06-06
jQuery讓控件左右移動(dòng)的三種實(shí)現(xiàn)方法
常用的方法就是把控件的CSS position屬性設(shè)置為relative或 absolute，大家也可以學(xué)習(xí)下本文提供的其他方法2013-09-09
需要在列表中顯示很多圖片，圖片高低不同，寬度都設(shè)置一樣了，要底部對(duì)齊2011-11-11
jQuery簡(jiǎn)單實(shí)現(xiàn)驗(yàn)證郵箱格式
這篇文章主要介紹了jQuery簡(jiǎn)單實(shí)現(xiàn)驗(yàn)證郵箱格式的相關(guān)資料,需要的朋友可以參考下2015-07-07
Jquery實(shí)現(xiàn)textarea根據(jù)文本內(nèi)容自適應(yīng)高度
本文給大家分享的是Jquery實(shí)現(xiàn)textarea根據(jù)文本內(nèi)容自適應(yīng)高度，這些在平時(shí)的項(xiàng)目中挺實(shí)用的，所以抽空封裝了一個(gè)文本框根據(jù)輸入內(nèi)容自適應(yīng)高度的插件，這里推薦給小伙伴們。2015-04-04
基于jquery的多彩百分比 動(dòng)態(tài)進(jìn)度條 投票效果顯示效果實(shí)現(xiàn)代碼
基于jquery的多彩百分比 動(dòng)態(tài)進(jìn)度條 投票效果顯示效果實(shí)現(xiàn)代碼，學(xué)習(xí)jquery的朋友可以參考下。2011-08-08
這個(gè)插件主要用于解決IE5.5與IE6.0下面的png圖片無(wú)法透明的解決方法，如果您的網(wǎng)站使用了png圖片而且訪客很大一部分是IE7之前的版本，可以使用這個(gè)。2010-08-08