首頁 > web前端 > js教程 > JQuery select(下拉框)操作方法總結_jquery

JQuery select(下拉框)操作方法總結_jquery

WBOY
發布: 2016-05-16 16:04:00
原創
1314 人瀏覽過

1. 取得選取項:
取得選取項的Value值:

複製程式碼 程式碼如下:

$('select#sel option:selected').val();


複製程式碼 程式碼如下:

$('select#sel').find('option:selected').val();

取得選取項目的Text值:
複製程式碼 程式碼如下:

$('select#seloption:selected').text();


複製程式碼 程式碼如下:

$('select#sel').find('option:selected').text();

2.   取得目前選取項目的索引值:
複製程式碼 程式碼如下:

$('select#sel').get(0).selectedIndex;

3.   取得目前option的最大索引值:
複製程式碼 程式碼如下:

$('select#sel option:last').attr("index")

4.   取得DropdownList的長度:
複製程式碼 程式碼如下:

$('select#sel')[0].options.length;


複製程式碼 程式碼如下:

$('select#sel').get(0).options.length;

5.  設定第一個option為選取值:
複製程式碼 程式碼如下:

$('select#sel option:first').attr('selected','true')


複製程式碼 程式碼如下:

$('select#sel')[0].selectedIndex = 0;

6.   設定最後一個option為選取值:
複製程式碼 程式碼如下:

$('select#sel option:last).attr('selected','true')

7.   依索引值設定任一option為選取值:
複製程式碼 程式碼如下:

$('select#sel')[0].selectedIndex =索引值;索引值=0,1,2....

8.   設定Value=4 的option為選取值:
複製程式碼 程式碼如下:

$('select#sel').attr('value','4');


複製程式碼 程式碼如下:

$("select#sel option[value='4']").attr('selected', 'true');

9. 値 = 3 のオプションを削除します:
コードをコピーします コードは次のとおりです:

$("select#sel オプション[value='3']").remove();

10. 削除するオプション:
コードをコピーします コードは次のとおりです:

$(" select#sel オプション ").eq(インデックス値).remove();
3 番目のラジオを削除したい場合:

コードをコピー コードは次のとおりです:
$(" select#sel オプション ").eq(2).remove();


11. 最初のオプションを削除します:
コードをコピーします コードは次のとおりです:
$(" select#sel オプション ").eq(0).remove();

または

コードをコピー コードは次のとおりです:
$("select#sel オプション:first").remove();


12. 最後のオプションを削除します:
コードをコピーします コードは次のとおりです:
$("select#sel オプション:last").remove();


13. ドロップダウンリストを削除します:
コードをコピーします コードは次のとおりです:
$("select#sel").remove();


14. 選択後にオプションを追加します:
コードをコピーします コードは次のとおりです:
$("select#sel").append("");


15. select の前にオプションを追加します:
コードをコピーします コードは次のとおりです:
$("select#sel").prepend("");


16. トラバースオプション:
コードをコピーします コードは次のとおりです:
$(' select#sel オプション ').each(function (index, domEle) {
//コードを書く
});

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板