快捷導(dǎo)航

jQuery操作選中select下拉框的值代碼實(shí)例

更新時(shí)間：2020年02月07日 10:22:58 作者：jason小蝸牛

這篇文章主要介紹了jQuery操作選中select下拉框的值代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下

js和jQuery聯(lián)合操作dom真的很好用，如果不是專業(yè)前端人員的話，我覺得吧前端語言只要熟練掌握js和jQuery就可以了。
獲取select下拉框的幾種情況如下：

1.獲取第一個(gè)option的值

$('#test option:first').val();

2.最后一個(gè)option的值

$('#test option:last').val();

3.獲取第二個(gè)option的值

$('#test option:eq(1)').val();

依次類推可以獲取第三個(gè)、第四個(gè)option的值

4.獲取選中的值

var groupid = $("#groupid").find("option:checked").val();
$('#groupidoption:selected').val();
$('#groupid').val();
<td align="center" class="tableFormLabel" >
  <select id="groupid" class="input-text" > </select>
</td>

5.設(shè)置值為2的option為選中狀態(tài)

$('#test').attr('value','2');

6.設(shè)置最后一個(gè)option為選中

$('#test option:last').attr('selected','selected');
$("#test").attr('value' , $('#test option:last').val());
$("#test").attr('value' , $('#test option').eq($('#test option').length - 1).val());

7.獲取select的長度

$('#test option').length;

8.添加一個(gè)option

var str="<option value='n+1'>第N+1項(xiàng)</option>";
$("#test").append(str); //一般都用這個(gè)追加

$("<option value='n+1'>第N+1項(xiàng)</option>").appendTo("#test");

9.刪除選中項(xiàng)

$('#test option:selected').remove();

10.刪除項(xiàng)選中的第一項(xiàng)

$('#test option:first').remove();

11.刪除滿足條件的option

$('#test option').each(function(){
  if( $(this).val() == '5'){
    $(this).remove();
  }
});

$('#test option[value=5]').remove();

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

jQuery的load()方法及其回調(diào)函數(shù)用法實(shí)例
這篇文章主要介紹了jQuery的load()方法及其回調(diào)函數(shù)用法,實(shí)例分析了load方法的簡單使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-03-03
jquery構(gòu)造器的實(shí)現(xiàn)代碼小結(jié)
jQuery的$符號非常神奇，它可以接受一個(gè)字符，也可以接受一個(gè)文檔對象或window對象，亦可以傳個(gè)函數(shù)進(jìn)行變?yōu)閐omReady加載器
2011-05-05
基于Jquery插件開發(fā)之圖片放大鏡效果(仿淘寶)
公司某個(gè)網(wǎng)站，需要實(shí)現(xiàn)圖片預(yù)覽效果，并能像淘寶一樣實(shí)現(xiàn)局部分大，使用jquery的朋友可以參考下。
2011-11-11
用jQuery旋轉(zhuǎn)插件jqueryrotate制作轉(zhuǎn)盤抽獎(jiǎng)
這篇文章主要為大家詳細(xì)介紹了用jQuery旋轉(zhuǎn)插件jqueryrotate制作轉(zhuǎn)盤抽獎(jiǎng)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-02-02
深入理解jQuery中l(wèi)ive與bind方法的區(qū)別
本篇文章主要是對jQuery中l(wèi)ive與bind方法的區(qū)別進(jìn)行了詳細(xì)的分析介紹，需要的朋友可以過來參考下，希望對大家有所幫助
2013-12-12
jQuery select控制插件
操作select下拉框的jquery插件，以后再涉及select時(shí)，利用這個(gè)插件就簡單多了。
2009-08-08
基于jQuery的判斷iPad、iPhone、Android是橫屏還是豎屏的代碼
在ipad、iphone網(wǎng)頁開發(fā)中，我們很可能需要判斷是橫屏或者豎屏。下面就來介紹如何用 jQuery 判斷iPad、iPhone、Android是橫屏還是豎屏的方法
2014-05-05
jquery中判斷圖片是否存在的實(shí)現(xiàn)代碼
有時(shí)候我們需要判斷當(dāng)前的圖片是否存在，方便后期做一些操作，當(dāng)然也可以參考上一篇文章，如果不存在就替換位默認(rèn)圖片
2023-06-06
利用JQuery操作iframe父頁面、子頁面的元素和方法匯總
這篇文章主要給大家介紹了關(guān)于利用JQuery操作iframe父頁面、子頁面的元素和方法的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。
2017-09-09
jQuery實(shí)現(xiàn)類似淘寶網(wǎng)圖片放大效果的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)類似淘寶網(wǎng)圖片放大效果的方法,實(shí)例分析了jquery實(shí)現(xiàn)圖片放大效果的方法,涉及jquery操作鼠標(biāo)事件及頁面元素屬性修改的相關(guān)技巧,需要的朋友可以參考下
2015-07-07