首頁 > web前端 > js教程 > 主體

js取得select標籤選取的值

不言
發布: 2018-03-31 14:15:22
原創
1801 人瀏覽過

這篇文章給大家分享的是js如何取得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;//索引

 

#第二種方式
$("#tesetSelect").find("option:selected").text( );//選取的文字
…….val();
…….get(0).selectedIndex;

 

 

-- ------------------------------------

如果select标签是有id属性的,如
<select id=xx>...
则用下述方法获取当前选项的值:
var v = xx.value;
或
var v = document.getElementById("xx").value;   //此方法兼容性好

如果select标签是有name属性的,如
<form name=form1>
<select name=xx>...
则用下述方法获取当前选项的值:
var v = form1.xx.value;
或
var v = document.getElementsByName("xx")[0].value;
如果同一页面含有多个name属性相同的标签,则上述[0]中的数字要改为相应的物理顺序号(从0起算)

如果select标签不含有任何可供定位的属性,如
<select>...
则用下述方法获取当前选项的值:
var v = document.getElementsByTagName("select")[0].value;
如果同一页面含有多个select标签,则上述[0]中的数字要改为相应的物理顺序号(从0起算)
----------------------------------------



对于以下select标签,获取当前选择的值得方式如下:

<select id="test" name="">
<option value="1">text1</option>
<option value="2">text2</option>
</select>
code:
一:javascript原生的方法
1:拿到select对象: var myselect=document.getElementById("test");
2:拿到选中项的索引:var index=myselect.selectedIndex ; // selectedIndex代表的是你所选中项的index
3:拿到选中项options的value: myselect.options[index].value;
4:拿到选中项options的text: myselect.options[index].text;
登入後複製

二:jquery方法(前提是已經載入了jquery函式庫)

1:var options=$("#test option:selected");  //取得選取的項目

2:alert(options.val());   //拿到選取項目的值

3:alert(options.text());   //拿到選取項目的文字

以上是js取得select標籤選取的值的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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