JS獲取select的value和text值的簡單實例
更新時間：2014年02月26日 10:04:02 作者：
本篇文章主要是對JS獲取select的value和text值的簡單實例進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助
復(fù)制代碼 代碼如下:
<select id = "cityList" >
<select id = "selectId" >
<option value = "0">第0個</option>
</select>
<script>
var selectObj = document.getElementById('selectId');
// 通過對象添加option
selectId.add(new Option("第一個","1"))
selectId.add(new Option("第二個","2"))
// 通過id添加option
selectId.add(new Option("第三個","3"))
selectId.add(new Option("第四個","4"))
// 通過id添加方法（也可以通過對象添加方法）
selectId.onchange = function(){
// 通過對象獲取value和text
alert(selectObj.value);
alert(selectObj.options[selectObj.selectedIndex].text);
// 通過 id 獲取value和text
alert(selectId.value);
alert(selectId.options[selectId.selectedIndex].text);
// 還可以通過this獲取value和text
alert(this.value);
alert(this.options[this.selectedIndex].text);
};
</script>
相關(guān)文章
微信小程序用canvas實現(xiàn)圓形進(jìn)度條
這篇文章主要為大家詳細(xì)介紹了微信小程序用canvas實現(xiàn)圓形進(jìn)度條，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-06-06
JS生態(tài)系統(tǒng)加速eslint解析器使用實例探索
這篇文章主要為大家介紹了JS生態(tài)系統(tǒng)加速之eslint解析器使用實例探索,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2024-01-01
js頁面引導(dǎo)頁的實現(xiàn)思路總結(jié)
在同學(xué)們使用某些網(wǎng)站的新版本頁面的時候，經(jīng)常會出現(xiàn)一個類似于新手引導(dǎo)一樣的效果，本文主要介紹了js頁面引導(dǎo)頁的實現(xiàn)思路總結(jié)，感興趣的可以了解一下2023-04-04
淺述節(jié)點的創(chuàng)建及常見功能的實現(xiàn)
本文主要對節(jié)點的創(chuàng)建及常見功能的實現(xiàn)方法進(jìn)行介紹，希望會對大家學(xué)習(xí)javascript有所幫助，下面就跟小編一起來看下吧2016-12-12
BootStrap智能表單實戰(zhàn)系列(六)表單編輯頁面的數(shù)據(jù)綁定
這篇文章主要介紹了BootStrap智能表單實戰(zhàn)系列(六)表單編輯頁面的數(shù)據(jù)綁定的相關(guān)資料,一般用于編輯頁面，本文介紹的非常詳細(xì)，具有參考借鑒價值，需要的朋友可以參考下2016-06-06
Javascript 是你的高階函數(shù)(高級應(yīng)用)
這篇文章主要介紹了Javascript 是你的高階函數(shù) ,需要的朋友可以參考下2015-06-06
本文主要介紹了uniapp中修改打包路徑,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2025-02-02
這篇文章主要為大家詳細(xì)介紹了基于JavaScript實現(xiàn)放大鏡放大購物圖片效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-01-01
數(shù)組去重復(fù)是一個常見的需求，我們暫時考慮同類型的數(shù)組去重復(fù)。主要是理清思路和考慮下性能。以下方法，有各人總結(jié)也有網(wǎng)上熱心網(wǎng)友的方法，這里簡單地總結(jié)一下。2015-08-08
uniapp小程序底部tabbar圖標(biāo)大小設(shè)置辦法
這篇文章主要給大家介紹了關(guān)于uniapp小程序底部tabbar圖標(biāo)大小設(shè)置辦法的相關(guān)資料,在使用uniapp進(jìn)行開發(fā)時,tabbar是我們使用的很頻繁的一個組件,但是在特定的平臺會有一些使用上的限制,需要的朋友可以參考下2023-08-08