javascript如何獲取當前選中的option項的文字和value值
select下拉選單是最為常用的表單元素之一,下面介紹一下如何獲取select下拉選單當前被選中option項的文字值和value值。
程式碼如下:
[HTML] 純文字檢視 複製程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <script type="text/javascript"> function check() { var sel=document.getElementById("sel"); var selValue=sel.options[sel.options.selectedIndex].value; var selTxt=sel.options[sel.options.selectedIndex].text; alert(selValue); alert(selTxt); } window.onload=function(){ var bt=document.getElementById("bt"); bt.onclick=function(){ check() } } </script> </head> <body> <select name="select" id="sel"> <option value="1" selected="selected">螞蟻部落一</option> <option value="2">螞蟻部落二</option> </select> <input type="button" value="點選獲取" id="bt"/> </div> </body> </html>
以上程式碼能夠彈出被選項的value值和text文字值,下面做一下簡單介紹:
1.var sel=document.getElementById("sel"),獲取select物件
2.sel.options.selectedIndex,獲取被選中項的索引值。
3.sel.options[sel.options.selectedIndex].value,獲取被選中項值,sel.options獲取option項的物件集合,根據索引值訪問相關項,使用value是獲取的value屬性值,使用text獲取的是文字值。
更多相關內容可以參閱javascript動態操作select下拉選單一章節。
相關文章
- 【Javascript】獲取選中的文字JavaScript
- JavaScript獲取選中checkbox valueJavaScript
- JavaScript 獲取當前月份JavaScript
- JQuery 獲取select被選中的value和textjQuery
- 獲取當前Tomcat例項的埠Tomcat
- JavaScript 獲取選中checkbox核取方塊的值JavaScript
- [前臺]---js獲取input標籤中name相同的各個value值JS
- XamarinEssentials教程獲取首選項的值
- JavaScript獲取選中radio單選按鈕值JavaScript
- Flutter 小知識,Key的使用(獲取當前點選Widget位置/獲取當前Widget大小)Flutter
- jquery獲得option的值和對option進行操作jQuery
- php 獲取當前域名和當前協議PHP協議
- python request 獲取cookies value值的方法PythonCookie
- 如何用js獲取當前時間和ip地址以及當前城市JS
- JavaScript怎麼獲取當前時間的年月日?JavaScript
- JavaScript獲取css的值JavaScriptCSS
- JVM 如何獲取當前容器的資源限制?JVM
- jquery獲取同一name的input的value值jQuery
- python 如何獲取當前時間Python
- JavaScript獲取選中checkbox核取方塊的選中值JavaScript
- JavaScript獲取當前站點的域名和埠號JavaScript
- 獲取類屬性值,當前類,父類
- mysql獲取指定表當前自增id值MySql
- android粘性廣播主動獲取當前值Android
- Java獲取Object中Value的方法JavaObject
- JS 獲取陣列物件的值&提取Object的valueJS陣列物件Object
- 使用layui框架的select獲取選中的值UI框架
- 為什麼 @Value 可以獲取配置中心的值?
- Java如何獲取當前執行緒Java執行緒
- pydantic 欄位的預設值設定獲取當前時間
- 獲取當前時間往前的日期
- Spark獲取當前分割槽的partitionIdSpark
- Java:如何輕鬆獲取當前執行的方法名Java
- 獲取當前時間
- 獲取當前元素在兄弟元素節點中的索引索引
- 小程式獲取當前元素在螢幕中的位置
- 如何用Java獲取當前時間戳?Java時間戳
- IE6/7/8中Option元素未設value時Select將獲取空字串字串
- 遞迴遍歷物件獲取value值遞迴物件