如何获取下拉列表选中的值

如何获取下拉列表选中的值,第1张

<!doctype html><html><head><!--获得下拉列表中的选中值--><style></style><script>function test(){var tes=documentgetElementById("tes");//获取select元素alert(tesoptions["内容值:"+tesselectedIndex]innerHTML+"元素值"+tesoptions[tesselectedIndex]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>

参考资料

csdncsdn[引用时间2018-1-25]

方法:获取多选下拉框对象数组→循环判断option选项的selected属性(true为选中,false为未选中)→使用value属性取出选中项的值。实例演示如下:

1、HTML结构

<select id="test" multiple="true">

<option value="option-A">option-A</option>

<option value="option-B">option-B</option>

<option value="option-C">option-C</option>

<option value="option-D">option-D</option>

</select>

<input type="button" value="确定" onclick="fun()" />

2、javascript代码

function fun(){

var select = documentgetElementById("test");

var str = [];

for(i=0;i<selectlength;i++){

if(selectoptions[i]selected){

strpush(select[i]value);

}

}

alert(str);

}

在HTML页面中,获取当前select元素中所选中的那个值和显示值。

<tr>

<th scope="row" width="15%" nowrap >目标字段</th>

<td><select name="idMbzd" style="width:25%" onchang=”on_idmbzd_change();”>

<option value=”1”>eg1</option>

<option value=”2”>eg2</option>

<option value=”3”>eg2</option>

</select>

</td>

</tr>

<script>

function on_idmbzd_change(){

var sel_obj = documentgetElementByIdx("idMbzd ");

var index = sel_objselectedIndex;

alert(sel_objoptions[index]value);

alert(sel_objoptions[index]text);

}

</script>

设置select元素的选中项:

通过<select>的属性来设置选中项,此方法可以在动态语言如php在后台根据需要控制输出结果。

< select id = "sel" >

< option value = "1" >1</ option >

< option value = "2" selected = "selected" >2</ option >

< option value = "3" >3</ option >

</ select >

扩展资料

超文本标记语言(外国语简称:HTML)标记标签通常被称为HTML标签,HTML标签是HTML语言中最基本的单位,HTML标签是HTML(标准通用标记语言下的一个应用)最重要的组成部分。

HTML标签的大小写无关的,例如“主体”<body>跟<BODY>表示的意思是一样的,推荐使用小写。

参考资料来源:百度百科-HTML

demo:

<select name="cityCode" id="cityCode" class="span2">

<option value="beijing">北京</option>

<option value="sanya" selected="selected">三亚</option>

<option value="shanghai">上海</option>

</select>

jquery获取方法选中的城市三亚:

$('#cityCode')find("option:selected")val()

首先$('#cityCode')根据id找到对应的select元素,然后通过jquery的find方法找到被选中的option元素,然后val()直接获取option的value。

或者

$("#cityCode option:selected")val();

下面的写法更简洁、条件拼接,实际与上面的是一致。

获取方法:

1var obj = documentgetElementByIdx_x(”testSelect”); //定位id。

2var index = objselectedIndex; // 选中索引。

3var text = objoptions[index]text; // 选中文本。

4var value = objoptions[index]value; // 选中值。

以下为具体html代码:

JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。

在1995年时,由Netscape公司的Brendan Eich,在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作,Netscape管理层希望它外观看起来像Java,因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。

以上就是关于如何获取下拉列表选中的值全部的内容,包括:如何获取下拉列表选中的值、如何在jsp文件中获得多选下拉框的值、如何获取和设置HTML文档中select元素的选中项等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9790029.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-02
下一篇 2023-05-02

发表评论

登录后才能评论

评论列表(0条)

保存