javascript獲取select值的方法完整實(shí)例
本文實(shí)例講述了javascript獲取select值的方法。分享給大家供大家參考，具體如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>www.fzitv.net javascript獲取select值</title>
</head>
<script>
//javascript獲取選中select值
/*
var obj = document.getElementById("testSelect"); //定位id
var index = obj.selectedIndex; // 選中索引
var text = obj.options[index].text; // 選中文本
var value = obj.options[index].value; // 選中值
*/
//jQuery獲取選中select值
/*
$('#testSelect option:selected').text();//選中的文本
$('#testSelect option:selected') .val();//選中的值
$("#testSelect ").get(0).selectedIndex;//索引
*/
window.onload=function() {
var oBtn=document.getElementById("oBtn1");
var oText=document.getElementById("oText1");
var oSelect=document.getElementById("select1");
var index=oSelect.selectedIndex ;
oBtn.onclick=function() {
alert(oSelect.options[index].text);
if(oText.value==""){
alert("請(qǐng)輸入內(nèi)容")
}else{
alert(oText.value+"----"+oSelect.options[oSelect.selectedIndex].text)
}
}
}
</script>
<body>
<input id="oText1" type="text" value=""/>
<input id="oBtn1" type="button" value="按鈕"/>
<select id="select1">
<option value="1">廣州</option>
<option value="2">上海</option>
<option value="3">北京</option>
</select>
</body>
</html>
運(yùn)行結(jié)果：
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼運(yùn)行效果。
更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題：《JavaScript操作DOM技巧總結(jié)》、《JavaScript頁(yè)面元素操作技巧總結(jié)》、《JavaScript事件相關(guān)操作與技巧大全》、《JavaScript查找算法技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
- 使用原生JS獲取select元素選中的value和text值
- JavaScript實(shí)現(xiàn)獲取select下拉框中第一個(gè)值的方法
- JavaScript獲取select中text值的方法
- javascript獲取select標(biāo)簽選中的值
- javascript獲取select值的方法分析
- js獲取select標(biāo)簽選中值的兩種方式
- jquery及原生js獲取select下拉框選中的值示例
- js獲取當(dāng)前select 元素值的代碼
- js 獲取當(dāng)前select元素值的代碼
- JavaScript獲取select選中值的兩種方法實(shí)現(xiàn)
相關(guān)文章
javascript移出節(jié)點(diǎn)removeChild()使用介紹
這篇文章主要介紹了javascript節(jié)點(diǎn)操作移出節(jié)點(diǎn)removeChild()的使用,需要的朋友可以參考下2014-04-04
在TypeScript中若一個(gè)變量使用了聯(lián)合類型,那么當(dāng)我們使用該變量時(shí)必不可少的會(huì)去明確的限制該變量的具體類型，這稱為類型縮小,這篇文章主要給大家介紹了關(guān)于TypeScript學(xué)習(xí)筆記之類型縮小的相關(guān)資料,需要的朋友可以參考下2022-09-09
微信小程序中實(shí)現(xiàn)埋點(diǎn)的方法示例詳解
在小程序中實(shí)現(xiàn)埋點(diǎn)的基本思路是利用生命周期函數(shù)和事件回調(diào),插入數(shù)據(jù)上報(bào)代碼,下面將介紹如何在小程序中實(shí)現(xiàn)埋點(diǎn),并通過(guò)代碼示例進(jìn)行說(shuō)明,感興趣的朋友一起看看吧2024-04-04
JavaScript實(shí)現(xiàn)跟隨滾動(dòng)緩沖運(yùn)動(dòng)廣告框
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)跟隨滾動(dòng)緩沖運(yùn)動(dòng)廣告框，頁(yè)面左右兩邊跟隨式廣告框，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-07
javascript兩種function的定義介紹及區(qū)別說(shuō)明
javascript兩種function的定義方式function a(){}和a=function(){}具體使用如下，感興趣的朋友可以參考下，希望對(duì)你對(duì)你學(xué)習(xí)function的定義有所幫助2013-05-05
JS點(diǎn)擊鏈接后慢慢展開(kāi)隱藏著圖片的方法
這篇文章主要介紹了JS點(diǎn)擊鏈接后慢慢展開(kāi)隱藏著圖片的方法,實(shí)例分析了javascript操作圖片的隱藏與現(xiàn)實(shí)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-02-02
js 冒泡事件與事件監(jiān)聽(tīng) 代碼分析2009-09-09
下面小編就為大家?guī)?lái)一篇老生常談原生JS執(zhí)行環(huán)境與作用域。小編覺(jué)得挺不錯(cuò)的，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧，祝大家游戲愉快哦2016-11-11
詳談構(gòu)造函數(shù)加括號(hào)與不加括號(hào)的區(qū)別
下面小編就為大家?guī)?lái)一篇詳談構(gòu)造函數(shù)加括號(hào)與不加括號(hào)的區(qū)別。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-10-10
為什么JS中eval處理JSON數(shù)據(jù)要加括號(hào)
這篇文章主要介紹了為什么JS中eval處理JSON數(shù)據(jù)要加括號(hào)的相關(guān)資料,需要的朋友可以參考下2015-04-04