用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实现鼠标经过显示动画边框特效
Mar 24 jQuery
简单谈谈require模块化jquery和angular的问题
Jun 23 jQuery
jQuery实现简单的计时器功能实例分析
Aug 29 jQuery
jQuery实现验证表单密码一致性及正则表达式验证邮箱、手机号的方法
Dec 05 jQuery
jQuery实现炫丽的3d旋转星空效果
Jul 04 jQuery
jQuery实现的监听导航滚动置顶状态功能示例
Jul 23 jQuery
jQuery实现菜单的显示和隐藏功能示例
Jul 24 jQuery
JQuery判断radio单选框是否选中并获取值的方法
Jan 17 jQuery
jQuery无冲突模式详解
Jan 17 jQuery
jQuery实现checkbox全选、反选及删除等操作的方法详解
Aug 02 jQuery
jquery实现的分页显示功能示例
Aug 23 jQuery
jQuery使用hide()、toggle()函数实现相机品牌展示隐藏功能
Jan 29 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
mysql5写入和读出乱码解决
2006/11/25 PHP
php set_magic_quotes_runtime() 函数过时解决方法
2010/07/08 PHP
php使用正则表达式提取字符串中尖括号、小括号、中括号、大括号中的字符串
2020/04/05 PHP
php set_include_path函数设置 include_path 配置选项
2016/10/30 PHP
详解Yii2.0使用AR联表查询实例
2017/06/16 PHP
Joomla框架实现字符串截取的方法示例
2017/07/18 PHP
Jquery升级新版本后选择器的语法问题
2010/06/02 Javascript
seaJs的模块定义和模块加载浅析
2014/06/06 Javascript
JavaScript实现显示函数调用堆栈的方法
2016/04/21 Javascript
AngularJS 输入验证详解及实例代码
2016/07/28 Javascript
详解js的作用域、预解析机制
2018/02/05 Javascript
JS动画定时器知识总结
2018/03/23 Javascript
Puppeteer环境搭建的详细步骤
2018/09/21 Javascript
django js 实现表格动态标序号的实例代码
2019/07/12 Javascript
Angular8 Http拦截器简单使用教程
2019/08/20 Javascript
JavaScript 几种循环方式以及模块化的总结
2020/09/03 Javascript
springboot+vue+对接支付宝接口+二维码扫描支付功能(沙箱环境)
2020/10/15 Javascript
[05:23]DOTA2-DPC中国联赛2月1日Recap集锦
2021/03/11 DOTA
python判断端口是否打开的实现代码
2013/02/10 Python
用Python实现服务器中只重载被修改的进程的方法
2015/04/30 Python
python 写入csv乱码问题解决方法
2016/10/23 Python
详解Python进程间通信之命名管道
2017/08/28 Python
django实现用户登陆功能详解
2017/12/11 Python
python中pylint使用方法(pylint代码检查)
2018/04/06 Python
Python深拷贝与浅拷贝用法实例分析
2019/05/05 Python
详解Python3序列赋值、序列解包
2019/05/14 Python
Django如何实现上传图片功能
2019/08/16 Python
python中如何实现将数据分成训练集与测试集的方法
2019/09/13 Python
python绘制封闭多边形教程
2020/02/18 Python
python GUI库图形界面开发之PyQt5多行文本框控件QTextEdit详细使用方法实例
2020/02/28 Python
Python 程序员必须掌握的日志记录
2020/08/17 Python
旅游项目开发策划书
2014/01/18 职场文书
暑期社会实践先进个人主要事迹
2014/05/22 职场文书
2014副镇长民主生活会个人对照检查材料思想汇报
2014/09/30 职场文书
党员观看《筑梦中国》心得体会
2016/01/18 职场文书
如何利用Python实现n*n螺旋矩阵
2022/01/18 Python