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


Posted in jQuery onJanuary 25, 2018

1.要想使用jquery首先html或者jsp中得引入jquery文件。

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

2.话不多说,上代码。

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<script type="text/javascript" src="../../../../js/common/jquery-1.6.2.js"></script>
		<script type="text/javascript">
			function doSome(){
				alert($("#sel option:selected").text());//方法一:获取select标签选中的option中的文本。
				alert($("#sel").find("option:selected").text());//方法二:获取select标签选中的option中的文本。
				
				alert($("#sel option:selected").val());//方法一:获取select标签选中的option中的value的值。
				alert($("#sel").find("option:selected").val());//方法二:获取select标签选中的option中的value的值。
				//------------------------------帅气的分割线,,下面有重点--------------------------------
				
				//当option是这样的:<option>cc</option>。即没有value属性的时候。自然也就没有value值。
				//这时候jquery就很纠结:写了段代码让我拿value的值,可是找到的option中根本没有value属性。
				//算了,把option中 的文本拿出来给你吧。
				//所以当选中<option>cc</option>这个option的时候,你会发现上边四个alert出来的值是一样的。都是option中的文本。
				//想要拿到option中的value的值,首先option得有value属性啊!!!
			}
		</script>
	</head>
	
	<body>
		<div>
			<select id="sel" onchange="doSome();">
				<option value="aa">bb</option>
				<option>cc</option>
			</select>
		</div>
	</body>
</html>

以上这篇用jquery获取select标签中选中的option值及文本的示例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery插件之validation插件
Mar 29 jQuery
Django1.7+JQuery+Ajax验证用户注册集成小例子
Apr 08 jQuery
jQuery遍历节点方法汇总(推荐)
May 13 jQuery
jQuery表单设置值的方法
Jun 30 jQuery
jQuery中的for循环var与let的区别
Apr 21 jQuery
jquery分页插件pagination使用教程
Oct 23 jQuery
JS/jQuery实现简单的开关灯效果【案例】
Feb 19 jQuery
jQuery实现文本显示一段时间后隐藏的方法分析
Jun 20 jQuery
JQuery中的常用事件、对象属性与使用方法分析
Dec 23 jQuery
JQuery获得内容和属性方法解析
May 30 jQuery
jQuery+ajax实现用户登录验证
Sep 13 jQuery
JS实现选项卡插件的两种写法(jQuery和class)
Dec 30 jQuery
jQuery zTree搜索-关键字查询 递归无限层功能实现代码
Jan 25 #jQuery
使用Ajax和Jquery配合数据库实现下拉框的二级联动的示例
Jan 25 #jQuery
解决Jquery下拉框数据动态获取的问题
Jan 25 #jQuery
jquery 获取索引值在一定范围的列表方法
Jan 25 #jQuery
jquery 输入框查找关键字并提亮颜色的实例代码
Jan 23 #jQuery
js和jQuery以及easyui实现对下拉框的指定赋值方法
Jan 23 #jQuery
jquery在启动页面时,自动加载数据的实例
Jan 22 #jQuery
You might like
php中如何防止表单的重复提交
2013/08/02 PHP
拖动布局之保存布局页面cookies篇
2010/10/29 Javascript
js弹出层之1:JQuery.Boxy (二)
2011/10/06 Javascript
基于jquery实现一张图片点击鼠标放大再点缩小
2013/09/29 Javascript
JavaScript框架(iframe)操作总结
2014/04/16 Javascript
jQuery实现鼠标滑向当前图片高亮显示并且其它图片变灰的方法
2015/07/27 Javascript
分享一个插件实现水珠自动下落效果
2016/06/01 Javascript
jQuery实现的导航下拉菜单效果
2016/07/04 Javascript
jQuery遍历节点树方法分析
2016/09/08 Javascript
微信小程序 实现列表项滑动显示删除按钮的功能
2017/04/13 Javascript
关于在mongoose中填充外键的方法详解
2017/08/14 Javascript
vue.js根据代码运行环境选择baseurl的方法
2018/02/28 Javascript
jQuery实现checkbox全选功能完整实例
2018/07/12 jQuery
JavaScript 对引擎、运行时、调用堆栈的概述理解
2018/10/22 Javascript
VUE实现移动端列表筛选功能
2019/08/23 Javascript
微信小程序3D轮播实现代码
2019/09/19 Javascript
Node中对非阻塞I/O、事件循环的知识点总结
2020/01/05 Javascript
微信小程序实现电影App导航和轮播
2020/11/30 Javascript
[01:02:34]TFT vs VGJ.T Supermajor 败者组 BO3 第二场 6.5
2018/06/06 DOTA
Python入门_浅谈逻辑判断与运算符
2017/05/16 Python
Django中login_required装饰器的深入介绍
2017/11/24 Python
使用python 爬虫抓站的一些技巧总结
2018/01/10 Python
python3 判断列表是一个空列表的方法
2018/05/04 Python
Python2.7版os.path.isdir中文路径返回false的解决方法
2019/06/21 Python
Python开发之基于模板匹配的信用卡数字识别功能
2020/01/13 Python
Python中join()函数多种操作代码实例
2020/01/13 Python
Python for循环通过序列索引迭代过程解析
2020/02/07 Python
关于python 跨域处理方式详解
2020/03/28 Python
HTML5新控件之日期和时间选择输入的实现代码
2018/09/13 HTML / CSS
医学专业本科毕业生自我鉴定
2013/12/28 职场文书
高三政治教学反思
2014/02/06 职场文书
法律专业求职信
2014/05/24 职场文书
仓库管理员岗位职责
2015/02/03 职场文书
公务员年度个人总结
2015/02/12 职场文书
2015年家长学校工作总结
2015/04/22 职场文书
2015学校图书管理员工作总结
2015/05/11 职场文书