`
liuxiang822
  • 浏览: 47887 次
  • 性别: Icon_minigender_1
  • 来自: 常州
社区版块
存档分类
最新评论

js获取select标签中的当前选项的两种方法

 
阅读更多

方法一：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>getSelectValue</title>
		<script src="js/jquery-1.5.1.min.js"></script>
	</head>

	<body>
		<select id="s_a">
			<option>java</option>
			<option>.net</option>
			<option>php</option>
		</select>
		<input type="button" value="click" onclick="alert(fetSelectVal();)"/>
	</body>
	<script>
                var _select = document.getElementById("s_a");
		function getSelectVal(){
			var idx = _select.selectedIndex,
		        option,
		        value;
		    if (idx > -1) {
		        option = _select.options[idx];
		        value = option.attributes.value;
		        return (value && value.specified) ? option.value : option.text; 
		   }
		    return null;
		}		
	</script>
</html>
 

方法二：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>getSelectValue</title>
		<script src="js/jquery-1.5.1.min.js"></script>
	</head>

	<body>
		<select id="s_a">
			<option>java</option>
			<option>.net</option>
			<option>php</option>
		</select>
		<input type="button" value="click" onclick="alert($('#s_a').find('option:selected').text());"/>
	</body>
</html>
分享到：
| 自定义EL表达式方法
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    js获取select标签选中值的两种方式

    在JavaScript和jQuery中，获取`&lt;select&gt;`标签中选中选项的值是常见的操作，尤其在处理表单数据时。以下将详细介绍这两种方法，并提供一些相关的扩展知识。 ### JavaScript 获取选中值 #### 方法一：原生 ...

    javascript获取select标签选中的值

    当我们需要获取用户在HTML页面中选择的`&lt;select&gt;`标签（下拉列表）的选项时，JavaScript提供了一些简单的方法。本文将详细介绍如何使用JavaScript以及jQuery来获取选中的值。 首先，通过JavaScript获取`&lt;select&gt;`...

    javascript获取下拉列表的值

    在JavaScript中，获取下拉列表（也称为选择框或`&lt;select&gt;`元素）的值是一项常见的任务，特别是在处理用户输入和交互时。本篇博文中，我们将深入探讨如何有效地实现这一功能。 首先，我们需要理解HTML中的`&lt;select&gt;`...

    清空select标签中option选项的3种不同方式

    本文将详细介绍三种不同的 JavaScript 方法来清空 `&lt;select&gt;` 标签中的所有 `option` 选项。 ### 方法一：通过 `.options.length` 属性 第一种方法是通过设置 `select` 元素的 `.options.length` 属性为 0 来删除...

    js 操作select和option

    ### JavaScript 操作 Select 和 Option 的方法详解 在网页开发中，`&lt;select&gt;` 元素是一种常见的表单控件，用于收集用户输入的选择项。它通常包含多个 `&lt;option&gt;` 子元素供用户选择。通过 JavaScript，我们可以实现...

    获取select的值

    在jQuery中，我们可以使用`.val()`方法来获取`select`元素当前选中的`option`的值。假设我们有一个`select`元素，如下所示： ```html &lt;select id="mySelect"&gt; &lt;option value="value1"&gt;Option 1 ...

    select2js，css和中文包

    2. **多选与单选**：Select2支持两种选择模式，即单选和多选。在多选模式下，用户可以选取多个选项；而在单选模式下，只能选择一个。 3. **搜索功能**：其内置的搜索功能允许用户在输入框中键入关键词，系统会实时...

    select获取下拉框的值 下拉框默认选中方法

    在实际开发中，我们经常需要获取select标签的值或将其默认选中某个选项本文将详细介绍select获取下拉框的值和默认选中方法。 一、获取select标签的值 在实际开发中，我们经常需要获取select标签的值，例如，我们...

    实现可编辑的select

    在提供的压缩包文件中，包含了两个JavaScript文件：`jquery.editable-select.min.js` 和 `jquery.editable-select.js`。这两个文件是jQuery的一个插件——Editable Select。jQuery是一个广泛使用的JavaScript库，它...

    select2.js

    本文将详细解析select2.js的核心功能和使用方法，帮助开发者更好地理解和应用这一强大的插件。 一、select2.js简介 select2.js是一款开源的JavaScript库，它提供了一个高度可定制的下拉选择框，集成了搜索、多选、...

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

    在Element UI框架中，`el-select`组件是一个常用的下拉...同时，通过`@change`事件可以同时获取`value`和`label`，适用于需要同时处理这两种值的场景。这样的设计使得在Vue.js应用中处理用户选择变得更加灵活和高效。

    Select 筛选 联动

    在`change()`函数中，首先获取当前test1的值（type），然后清空test2的所有选项，如果type有值并且在$dateop对象中存在对应的数组，就将该数组中的所有选项重新添加到test2中。 这种联动筛选的实现方式可以提高用户...

    纯js超酷select下拉框美化插件

    3. **内置主题**：TastySelect提供两种预设的主题，这些主题经过精心设计，符合现代审美，可以轻松融入各种网页设计风格。 4. **CSS3动画过渡**：利用CSS3的过渡效果，TastySelect在用户交互时能够展现出平滑流畅的...

    Javascript Select操作大集合

    在JavaScript中，有两种方式可以向Select添加Option。一种是针对Internet Explorer浏览器的`Add()`方法，如`selTarget.Add(new Option("text","value"))`。另一种方式是使用DOM操作，适用于所有现代浏览器，包括...

    js实现select搜索.rar

    在网页开发中，选择框（Select）是一种常见的交互元素，用于让用户从预设的选项中进行选择。然而，原生的HTML `&lt;select&gt;` 元素功能较为基础，无法满足复杂的需求，例如搜索功能。这就是`jQuery bootstrap-select`...

    javascript写的select

    - **浏览器兼容性处理**：为了适应不同的浏览器环境，在设置文本内容时使用了`innerText`和`textContent`两种方法。 #### 4. 扩展功能与优化建议 - **增强用户体验**：可以通过添加动画效果来提升用户交互体验，...

    javascript html js 自定义多级联动下拉菜单,自定义select联动

    - 在事件处理函数中，获取当前选中的值，并据此更新下一个级别的`&lt;select&gt;`选项。 - 可能需要对数据进行处理，比如将值映射到相应的子级数据集。 - 清空并填充下一个级别的`&lt;option&gt;`元素。 3. **DOM操作**： -...

    用jquery获取select标签中选中的option值及文本的示例

    `doSome()` 函数中展示了两种方式来获取选中 `option` 的文本和值： 1. 使用 `$("#sel option:selected").text()` 和 `$("#sel option:selected").val()`： 这两个方法分别获取选中 `option` 的文本内容和 `value`...

    select下拉框添加搜索功能

    在`select`下拉框中实现搜索功能，一般有两种常见方法：一种是原生HTML和JavaScript的实现，另一种是借助第三方库，如本例中的`jquery.editable-select`。 1. **原生HTML和JavaScript实现**： 使用原生方式需要...

Magicbox
Global site tag (gtag.js) - Google Analytics