jquery及原生js獲取select下拉框選中的值示例
更新時間：2013年10月25日 09:29:02 作者：
有一id=test的下拉框，怎么拿到選中的那個值呢？本文將采用javascript原生的方法及jquery方法（前提是已經(jīng)加載了jquery庫）來簡單實(shí)現(xiàn)下
現(xiàn)在有一id=test的下拉框，怎么拿到選中的那個值呢？
分別使用javascript原生的方法和jquery方法
<select id="test" name="">
<option value="1">text1</option>
<option value="2">text2</option>
</select>
一：javascript原生的方法
1:拿到select對象： var myselect=document.getElementById("test");
2：拿到選中項(xiàng)的索引：var index=myselect.selectedIndex ; // selectedIndex代表的是你所選中項(xiàng)的index
3:拿到選中項(xiàng)options的value： myselect.options[index].value;
4:拿到選中項(xiàng)options的text： myselect.options[index].text;
二：jquery方法（前提是已經(jīng)加載了jquery庫）
1:var options=$("#test option:selected"); //獲取選中的項(xiàng)
2:alert(options.val()); //拿到選中項(xiàng)的值
3:alert(options.text()); //拿到選中項(xiàng)的文本
分別使用javascript原生的方法和jquery方法
復(fù)制代碼 代碼如下:
<select id="test" name="">
<option value="1">text1</option>
<option value="2">text2</option>
</select>
一：javascript原生的方法
1:拿到select對象： var myselect=document.getElementById("test");
2：拿到選中項(xiàng)的索引：var index=myselect.selectedIndex ; // selectedIndex代表的是你所選中項(xiàng)的index
3:拿到選中項(xiàng)options的value： myselect.options[index].value;
4:拿到選中項(xiàng)options的text： myselect.options[index].text;
二：jquery方法（前提是已經(jīng)加載了jquery庫）
1:var options=$("#test option:selected"); //獲取選中的項(xiàng)
2:alert(options.val()); //拿到選中項(xiàng)的值
3:alert(options.text()); //拿到選中項(xiàng)的文本
您可能感興趣的文章:
相關(guān)文章
JavaScript數(shù)組操作學(xué)習(xí)之splice()函數(shù)入門與精通
這篇文章介紹了JavaScript數(shù)組操作中的splice()方法,詳細(xì)講解了其定義、語法和用法,并通過實(shí)例展示了如何使用該方法進(jìn)行數(shù)組元素的添加、刪除和替換,需要的朋友可以參考下2024-11-11
本文主要介紹了js中的循環(huán)方式及各種遍歷的方法，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-12-12
JavaScript?canvas?實(shí)現(xiàn)用代碼畫畫
這篇文章主要為大家介紹了JavaScript?canvas?實(shí)現(xiàn)用代碼畫畫示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-11-11
本文通過實(shí)例給大家分享了原生JS進(jìn)行前后端同構(gòu)的相關(guān)知識點(diǎn)以及相關(guān)代碼，有需要的朋友參考學(xué)習(xí)下。2018-04-04
這篇文章主要介紹了詳解es6新增數(shù)組方法簡便了哪些操作，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
JavaScript canvas復(fù)刻蘋果發(fā)布會環(huán)形進(jìn)度條
canvas 真是一個好東西，它給前端插上了想象的翅膀，伴隨著 h5 而來，將 web 代入了新的領(lǐng)域。本文將利用anvas復(fù)刻蘋果發(fā)布會環(huán)形進(jìn)度條，感興趣的可以嘗試一下2022-07-07
因業(yè)務(wù)需要，在網(wǎng)上查找這個問題的解決辦法，但是昏天黑地地搞了半天，找到的方法雖然可以實(shí)現(xiàn)功能，但是總是會跳出討厭的“關(guān)閉窗口”的提示框，郁悶。2009-01-01
新發(fā)現(xiàn)一個騙鏈接的方法(js讀取cookies)
新發(fā)現(xiàn)一個騙鏈接的方法(js讀取cookies)，需要的朋友可以參考下。2012-01-01
javascript實(shí)現(xiàn)自動輸出文本（打字特效）
文字如何實(shí)現(xiàn)打字的效果呢?在瀏覽網(wǎng)頁的時候也經(jīng)常能看到這種效果。本文給大家匯總介紹了幾種打字效果的文字特效,文字一個一個地打印在頁面上。2015-08-08
layUI使用layer.open,在content打開數(shù)據(jù)表格,獲取值并返回的方法
今天小編就為大家分享一篇layUI使用layer.open,在content打開數(shù)據(jù)表格,獲取值并返回的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09