`
cry615
  • 浏览: 153681 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js 获取select标签label内容

    博客分类:
  • js
 
阅读更多

select标签内容:

<select name="procode" onchange="alert(this.options[this.selectedIndex].text)">
	<option value="100">北京</option>
	<option value="200">广东</option>
	<option value="210">上海</option>
	<option value="220">天津</option>
	<option value="230">重庆</option>
	<option value="240">辽宁</option>
	<option value="250">江苏</option>
	<option value="270">湖北</option>
	<option value="280">四川</option>
	<option value="290">陕西</option>
	<option value="311">河北</option>
	<option value="351">山西</option>
	<option value="371">河南</option>
</select>

1.获取select对象

var selectObj = document.getElementsByName("procode")[0];

2.获取对象label

var procodeLabel= selectObj .options[selectObj .selectedIndex].text;

第二种方式

var procodeLabel= selectObj .options[selectObj .selectedIndex].innerText。

分享到:
评论

相关推荐

    element-ui 关于获取select 的label值方法

    本文将详细讲解如何在Element UI中获取`el-select`组件选中的`label`值,以及如何同时获取`value`和`label`的值。 1. 获取`el-select`的`label`值: 在Element UI中,`el-select`的`v-model`绑定的是选中项的`value...

    js获取asp.net服务器端控件Label,TextBox,RadioButtonList,DropDownList的值

    ### js获取ASP.NET服务器端控件Label,TextBox,RadioButtonList,DropDownList的值 在Web开发中,JavaScript经常被用来增强用户体验,实现页面的动态效果。对于基于ASP.NET的项目而言,开发者通常需要通过JavaScript...

    bootstrap select 标签

    而 Bootstrap Select 插件通过引入 CSS 和 JavaScript 文件,可以将这些普通的下拉菜单转变为具有现代设计感的组件。这不仅改善了用户体验,也增加了交互性。 以下是一些关于如何使用 Bootstrap Select 的关键知识...

    超好用的select标签-带api

    在本篇文章中,我们将深入探讨如何使用`&lt;select&gt;`标签,并结合JavaScript API,来实现更丰富的交互功能。我们将涵盖以下几个方面: 1. **基本使用** - `&lt;select&gt;`标签的基本结构:`&lt;select&gt;&lt;/select&gt;`,其中可以...

    vue.js 获取select中的value实例

    在本文中,我们将学习如何在Vue.js框架中获取select下拉列表中的选中值。Vue.js是一种流行的JavaScript框架,用于构建用户界面和单页应用程序。它允许我们使用响应式数据绑定和组件化的视图组件。下面,我们将通过一...

    用javascript实现select的美化的方法

    在 Web 开发中,Select 标签是一种常用的表单控件,但它的样式难以通过 CSS 美化,特别是在不同的浏览器中,这就需要使用 JavaScript 来实现美化。 实现思路 美化 Select 的步骤可以分为四步: 1. 将 Select 标签...

    EL,jstl,js 对select元素

    在`&lt;select&gt;`元素上下文中,JSTL的`&lt;c:forEach&gt;`标签特别有用,可以配合EL动态生成`&lt;option&gt;`标签。除此之外,JSTL的`&lt;c:set&gt;`标签可用于设置变量,`&lt;c:if&gt;`可以控制选项的显示条件。 **JavaScript** JavaScript是...

    HTML中的select标签如何使用.docx

    通过JavaScript,我们可以获取用户的选择,或者在运行时动态改变`&lt;select&gt;`标签的内容。例如,使用`document.getElementById('selectId').value`可以获取选中的选项的值。 7. **表单提交** 当`&lt;select&gt;`标签作为...

    使用select2实现下拉列表动态模糊查询

    在这个压缩包中,我们有`select2.min.css`(样式文件)和`select2.min.js`(JavaScript 文件)。将这两个文件放入你的项目目录,并在HTML文件中引用它们。例如,在`&lt;head&gt;` 标签内添加: ```html &lt;link href="...

    layui使用label标签的方法

    在这个布局中,"选择课程:"是label标签的文本内容,而select元素是被label标签包裹的表单元素。需要注意的是,在实际开发中,label标签的for属性需要与对应的表单元素的id属性相匹配,这样点击label标签时,就可以...

    ySelect-master.zip

    - **分组(Group)**:如果`&lt;select&gt;`内的`&lt;option&gt;`包含`&lt;optgroup&gt;`标签,`ySelect.js`会自动处理分组显示。 3. **配置项** `ySelect.js`允许开发者通过`data-config`属性传递JSON对象来定制插件行为。以下是...

    bootstrap select树形下拉框

    在HTML中,下拉框通常使用`&lt;select&gt;`标签创建,而树形结构则需要通过JavaScript库如jQuery或者更专业的UI库如jQuery UI或AngularJS来实现。Bootstrap Select通过插件的形式将这两者融合,使得在网页中可以方便地创建...

    vue treeselect获取当前选中项的label实例

    本文将详细介绍如何使用Vue Treeselect组件来获取当前选中项的label信息,这对于提升用户交互体验和数据处理非常关键。 Vue Treeselect是一个基于Vue.js的多选下拉树控件,允许用户以树形结构方式选择数据项。它...

    iOS中Safari浏览器select下拉列表文字太长被截断的处理方法.docx

    这个改动虽然增加了`&lt;optgroup&gt;`,但并不会影响到使用JQuery或者其他JavaScript库获取`&lt;select&gt;`选中值的操作。例如,我们依然可以使用`$('#sel_model').val()`来获取下拉列表当前选中的选项值。 使用`&lt;optgroup&gt;`...

    select 下拉框可以多选

    例如,为`select`元素添加`aria-label`或`aria-labelledby`属性,以便于屏幕阅读器读取。 综上所述,"select下拉框可以多选"涉及到HTML、CSS、JavaScript基础,以及可能的库和插件的使用,还有无障碍性设计。掌握...

    多选select组件 涉及的所有常用操作

    在JavaScript中,可以遍历`&lt;select&gt;`元素的`selectedOptions`属性来获取所有选中选项: ```javascript var select = document.querySelector('select'); var selectedValues = []; for (var i = 0; i &lt; select....

    jsp 开发之struts2中s:select标签的使用

    本篇文章将详细介绍在Struts2中如何使用`s:select`标签,以及通过几个具体例子来展示其用法。 1. 第一个例子: ```jsp &lt;s:select list="{'aa','bb','cc'}" theme="simple" headerKey="00" headerValue="00"&gt;&lt;/s:...

    下拉框多选select多选

    每个`&lt;option&gt;`标签代表一个可选项,`value`属性用于设定选项的值,而文本内容则显示在下拉菜单中。 **二、CSS美化** 默认的多选下拉框样式可能并不符合所有设计需求。使用CSS可以调整其外观,例如改变字体、颜色...

    bootstrap-select-master下拉框。

    9. **API 方法**:除了初始化,插件还提供了一系列方法供你在运行时操作下拉框,如 `selectpicker('refresh')` 更新下拉框,`selectpicker('val')` 获取或设置当前选中的值。 10. **无障碍访问**(A11Y):...

Global site tag (gtag.js) - Google Analytics