jquery操作select下拉選單簡單介紹

由於select下拉使用的頻繁，所以對於它的操作必須要頻繁，下面介紹一下如何使用jquery操作select下拉選單。

一.獲取value和text值:

[JavaScript] 純文字檢視 複製程式碼
var checkText=$("#selId").find("option:selected").text();//獲取選中option項的文字值。
var checkValue=$("#selId").val();//獲取選中的option項的value值。
var checkIndex=$("#selId").get(0).selectedIndex;//獲取選中option項的索引值。
var maxIndex=$("#selId option:last").attr("index");//獲取option項的最大索引值

二.設定value和text值:

[JavaScript] 純文字檢視 複製程式碼
$("#selId").get(0).selectedIndex=1;//將索引值為1的option項選中。
$("#selId").val("thevalue");//設定select下拉選單的value值為"thevalue"。
$("#selId option[text='antzone']").attr("selected",true);//將text值為antzone的項選中。

三.新增或者刪除option項:

[JavaScript] 純文字檢視 複製程式碼
$("#selId").append("<option value='antzone'>螞蟻部落</option>");//為select下拉選單追加一個option項
$("#selId").prepend("<option value='0'>請選擇</option>");//在select下拉選單開頭新增一個option項。
$("#selId option:last").remove();//刪除Select選單最後一個option。
$("#selId option[index='0']").remove();//刪除索引值為0的option項。
$("#selId option[value='antzone']").remove();//刪除value屬性值為antzone的option。
$("#selId option[text='螞蟻部落']").remove();//刪除text值為螞蟻部落的option。