`
liuxiang822
  • 浏览: 48027 次
  • 性别: 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>
分享到:
评论

相关推荐

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

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

    select2js,css和中文包

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

    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 ...

    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实现**: 使用原生方式需要...

Global site tag (gtag.js) - Google Analytics