如何获取下拉列表选中的值 jquery
推荐于2018-02-22 · 知道合伙人互联网行家
关注
展开全部
分别使用javascript原生的方法和jquery方法
<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()); //拿到选中项的文本
<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()); //拿到选中项的文本
展开全部
<!doctype html>
<html>
<head>
<!--获得下拉列表中的选中值-->
<style>
</style>
<script>
function test(){
var tes=document.getElementById("tes");//获取select元素
alert(tes.options["内容值:"+tes.selectedIndex].innerHTML+"元素值"+tes.options[tes.selectedIndex].value);//通过selectedIndex获得选中的选项的下标,再通过options[]集合获取选中的option元素
}
</script>
<meta charset="UTF-8">
</head>
<body>
<select id="tes" onchange="test()"><!--选项值改变时触发onchange()事件-->
<option value="帅哥" checked="checked" id="test1">帅哥</option>
<option value="美女" id="test2">美女</option>
<option value="ladybody" id="test3">ladybody</option>
</select>
</body>
</html>
参考资料
csdn.csdn[引用时间2018-1-25]
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<script language="javascript">
function getselectvalue()
{
var rtl=document.getElementById("rtl");
alert(rtl.options.(rtl.selectedIndex).value);
}
</script>
以楼上的数据来用
<select name="sel" id="rtl" >
<option>菜单一</option>
<option>菜单二</option>
<option>菜单三</option>
</select>
<input type="button" onclick="getselectvalue()" value="弹出下拉列表的值" />
加分咯!很辛苦的
function getselectvalue()
{
var rtl=document.getElementById("rtl");
alert(rtl.options.(rtl.selectedIndex).value);
}
</script>
以楼上的数据来用
<select name="sel" id="rtl" >
<option>菜单一</option>
<option>菜单二</option>
<option>菜单三</option>
</select>
<input type="button" onclick="getselectvalue()" value="弹出下拉列表的值" />
加分咯!很辛苦的
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<select onchange="isSelected(this.value);" id="city">
<option
value="1">北京</option>
<option value="2" >上海</option>
<option value="2" >广州</option>
</select>
也就是说当用户选择“上海”这一列时,需要将“上海”这个名称保存起来。其实方法很简单。看下面javascript代码:
function isSelected(value) {
var cityName;
var city =
document.getElementById("city");
//获取选中的城市名称
for(i=0;i<city.length;i++){
if(city[i].selected==true){
cityName
= city[i].innerText; //关键点
alert("cityName:" + cityName);
}
}
也可以这样做:
function isSelected(value) {
var city = document.getElementById("city");
alert(city.options[city.selectedIndex].innerText);
}
大致解释一下,首先在HTML页面上有一个下拉框,并为此下拉框定了一个“city”的id,并为其绑定了一个onchange事件,通过此事件调用javascript函数。
在javascript函数当中,通过domcument对象获取当前下拉框的节点元素,由于节点的值并非只有一个,所以我们可以通过循环节点来得到每个选项的值。在循环的时候通过判断当前选项是否选中,如果选中则使用city[i].innerText
方式获取当前所选中的文本值。当然如果需要获取选项值,只需如此即可:city[i].value.
至此,通过以上方法在IE下已能达到所要的结果。但是,在FIREFOX下测试时,发现此法不起作用,最后通过查阅资料发现另外一个方法。将city[i].innerText
改为 city[i].text即可。这种方法对IE及FIXEFOX都适用!
<option
value="1">北京</option>
<option value="2" >上海</option>
<option value="2" >广州</option>
</select>
也就是说当用户选择“上海”这一列时,需要将“上海”这个名称保存起来。其实方法很简单。看下面javascript代码:
function isSelected(value) {
var cityName;
var city =
document.getElementById("city");
//获取选中的城市名称
for(i=0;i<city.length;i++){
if(city[i].selected==true){
cityName
= city[i].innerText; //关键点
alert("cityName:" + cityName);
}
}
也可以这样做:
function isSelected(value) {
var city = document.getElementById("city");
alert(city.options[city.selectedIndex].innerText);
}
大致解释一下,首先在HTML页面上有一个下拉框,并为此下拉框定了一个“city”的id,并为其绑定了一个onchange事件,通过此事件调用javascript函数。
在javascript函数当中,通过domcument对象获取当前下拉框的节点元素,由于节点的值并非只有一个,所以我们可以通过循环节点来得到每个选项的值。在循环的时候通过判断当前选项是否选中,如果选中则使用city[i].innerText
方式获取当前所选中的文本值。当然如果需要获取选项值,只需如此即可:city[i].value.
至此,通过以上方法在IE下已能达到所要的结果。但是,在FIREFOX下测试时,发现此法不起作用,最后通过查阅资料发现另外一个方法。将city[i].innerText
改为 city[i].text即可。这种方法对IE及FIXEFOX都适用!
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
1:js取值
//获取下拉列表选中项的值
代码如下
function getSelectedValue(name){
var obj=document.getElementById(name);
return obj.value; //直接用其对象的value属性便可获取到
}
2:获取文本值
代码如下
<select Id="select">
<option>1</option>
<option selected="selected">2</option>
<option>3</option>
</select>
<script language="javascript" type="text/javascript">
var ById = document.getElementById("Select")
alert(ById.options[ById.selectedIndex].text)
</script>
//获取下拉列表选中项的值
代码如下
function getSelectedValue(name){
var obj=document.getElementById(name);
return obj.value; //直接用其对象的value属性便可获取到
}
2:获取文本值
代码如下
<select Id="select">
<option>1</option>
<option selected="selected">2</option>
<option>3</option>
</select>
<script language="javascript" type="text/javascript">
var ById = document.getElementById("Select")
alert(ById.options[ById.selectedIndex].text)
</script>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询