`

使用js获取下拉列表框中的value和text的值

 
阅读更多

在编程过程中,我们对下拉列表框的取值很多时候都是获取option中的value,但是也有需要获取显示在页面中的值的时候,例如想获得<option value="value">ShowText</option>中"ShowText",我们该如何获取呢?方法很简单,具体代码如下:

<script type="text/javascript">
function a(object){
alert(object);
}
</script>

<!-- 获取显示的值 -->
<select onchange="a(this.options[this.selectedIndex].innerText);">
<option value="value-a">text-a</option>
<option value="value-b">text-b</option>
</select>

<!-- 获取value的值 -->
<select onchange="a(this.options[this.selectedIndex].value);">
<option value="value-c">text-c</option>
<option value="value-d">text-d</option>
</select>

function isSelect(selectPress) {
            //var select = document.getElementById("mySelect").ind;
            var selectValue = selectPress.options[selectPress.selectedIndex].value; //显示value 下标0、1、2
            var selectValue2 = selectPress.options[selectPress.selectedIndex].innerText; //显示显示的值 具体内容(上海、北京)
            //alert(selectValue);
            //alert(selectValue2);
            if (selectValue == "-1") {
                alert("请选择城市,表单提交被拒绝!")
                return;
            }
            else {
                document.getElementById('form1').submit(); //form表单提交
            }
        } 

<select onchange="isSelect(this);" id="mySelect">
        <option value="-1">--请选择--</option>
        <option value="0">北京</option>
        <option value="1">上海</option>
        <option value="2">武汉</option>
    </select>

分享到:
评论

相关推荐

    js处理下拉列表框

    根据给定的信息,本文将详细解释JavaScript代码片段中涉及的关键概念和技术细节,这些技术主要用于处理HTML页面中的下拉列表框。 ### 一、JavaScript与HTML交互基础 在深入解析这段代码之前,我们先来了解一些基本...

    javascript获取下拉列表框当中的文本值示例代码

    总结一下,通过这篇文章,我们学习了如何在HTML页面中使用JavaScript语言来捕捉下拉列表框选项的变更,并获取用户选中的文本值。掌握了这一技能,开发者可以更灵活地在网页中实现动态交互功能,从而提升用户体验。

    使用JQuery左右移动下拉列表框中的值

    标题“使用JQuery左右移动下拉列表框中的值”涉及的是在网页开发中利用JavaScript库JQuery来操作HTML的下拉列表(select元素),特别是实现选中项在两个并排的下拉列表之间动态移动的功能。这样的功能常见于用户需要...

    js获取下拉列表中选中的值和文本

    以上示例代码中包含了完整的HTML结构,展示了如何使用JavaScript获取下拉列表的选中值和文本,以及如何获取和修改单选按钮组的选中项。这些技术在实际开发中非常有用,能够帮助开发者更好地处理表单数据。

    js实现下拉列表选中某个值的方法(3种方法)

    JavaScript实现下拉列表选中某个值的方法主要包括三种方式,分别为通过索引选择、通过name或id选择以及通过value值选择。以下详细阐述每种方法的实现原理和步骤。 首先,了解基本的HTML结构,一个下拉列表通常由一...

    js获取下拉列表框&lt;option&gt;中的value和text的值示例代码

    本篇文章将详细介绍如何通过JavaScript获取`&lt;option&gt;`标签中的`value`和`text`属性值。 首先,`&lt;option&gt;`标签用于创建下拉列表中的选项。它有两个关键属性: 1. `value`:这个属性定义了选项的值,通常用于服务器...

    下拉列表选中项的文本值的赋值与取值

    获取下拉列表当前选中项的文本值,可以使用JavaScript的`options`属性和`text`属性。下面是一个示例: ```javascript var selectedOption = document.getElementById('mySelect').selectedIndex; var selectedText ...

    js获取下拉列表框option中的value和text的值示例代码

    在编程过程中,我们对下拉列表框的取值很多时候都是获取option中的value,但是也有需要获取显示在页面中的值的时候,例如想获得&lt;option value=”value”&gt;ShowText中”ShowText”,我们该如何获取呢?方法很简单,...

    js下拉选择框与输入框联动实现添加选中值到输入框的方法

    本文介绍的下拉选择框与输入框的联动技术,是通过在JavaScript中监听下拉选择框的onchange事件,并利用DOM操作来改变输入框的值。这是一种常用的前端交互技术,适用于多种Web应用场景。在实际开发中,开发者可以根据...

    javascript 获取select ->option中id、value、label属性及中内容

    javascript 获取select -&gt;option中id、value、label属性及&lt;option&gt;&lt;/option&gt;中内容

    浏览器如何自动填写网页下拉列表框、单选框和复选框

    本文主要讲解了如何在木头浏览器中实现对网页下拉列表、单选框和复选框的自动填写。 首先,针对网页下拉列表的自动填写,有四种实现方法。第一种方法是通过设置`value`属性,例如,若要选择“河南省”,找到其对应...

    javascript对下拉列表框(select)的操作实例讲解

    通过`&lt;option&gt;`元素的`value`属性可以获得选项的值,通过`text`属性可以得到显示在下拉列表中的文字。 6. **删除、追加和更改选项** 使用`f.s.options[index]=null`可以删除指定索引的选项; 使用`f.s.options[f....

    jQuery操作下拉列表框

    在这个函数中,我们首先获取下拉列表框`ISHIPTYPE`中所有选项的数量,然后通过`each()`遍历每一个`option`元素。如果`option`的`value`属性等于111并且`shipping.value`不等于"CA",则移除该选项。反之,如果条件...

    JS获取下拉列表所选中的TEXT和Value的实现代码

    在JavaScript中,获取下拉列表(`&lt;select&gt;`元素)所选中的文本(`text`)和值(`value`)是一项常见的需求。这在网页交互中尤其有用,例如提交表单时获取用户的选择,或者根据用户的选择做出动态响应。在给出的示例...

    js下拉列表也可以这么使用??有点变态

    本文将深入探讨如何创新性地使用JavaScript来增强下拉列表的功能,让它变得“有点变态”,同时也会涉及一些相关的源码和工具。 首先,让我们了解下拉列表的基本用法。在HTML中,我们可以通过以下方式创建一个简单的...

    JS获取select的value和text值的简单实例

    本文将详细讲解如何通过JavaScript获取`&lt;select&gt;`元素的`value`和`text`值,以及如何动态添加`&lt;option&gt;`。 首先,让我们分析一下给出的代码片段: ```html &lt;!-- 省略部分 --&gt; &lt;option value="0"&gt;第0个 ...

    下拉列表完全模糊匹配

    最关键的部分是使用JavaScript监听搜索框的输入事件,当用户输入时,遍历下拉列表的所有选项,检查是否包含用户输入的关键字,并根据匹配情况动态更新下拉列表的可见性。这里我们可以使用`addEventListener`来绑定...

    网页下拉列表框菜单跳转的三种实现方法.pdf

    网页下拉列表框菜单跳转是指在网页中使用下拉列表框来实现菜单项的跳转到另一个页面的功能。在本文中,我们将介绍三种实现网页下拉列表框菜单跳转的方法。 方法一:使用Dreamweaver自制的JavaScript脚本 ...

    javascript实现通过拼音首字母快速选择下拉列表

    本篇文章将深入探讨如何使用JavaScript实现一个通过拼音首字母快速选择下拉列表的功能,这一功能通常用于提高用户在网页上的数据输入效率,特别是处理大量中文姓名或词汇时。 首先,我们需要理解HTML的基本结构,它...

    jQuery带搜索过滤功能的下拉列表框.zip

    在网页开发中,下拉列表框(Dropdown List)是常见的用户交互元素,用于提供多个选项供用户选择。然而,当选项过多时,用户查找特定选项可能会变得困难。为了解决这个问题,我们可以利用jQuery库来实现一个带搜索...

Global site tag (gtag.js) - Google Analytics