用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滚动插件scrollable.js用法分析
May 25 jQuery
基于jquery实现多选下拉列表
Aug 02 jQuery
基于jQuery实现图片推拉门动画效果的两种方法
Aug 26 jQuery
jquery之基本选择器practice(实例讲解)
Sep 30 jQuery
jQuery.Sumoselect插件实现下拉复选框效果
Nov 09 jQuery
jquery ztree实现右键收藏功能
Nov 20 jQuery
jQuery实现表单动态添加数据并提交的方法
Jul 19 jQuery
jQuery利用FormData上传文件实现批量上传
Dec 04 jQuery
jQuery子选择器与可见性选择器实例分析
Jun 28 jQuery
jQuery实现消息弹出框效果
Dec 10 jQuery
JS JQuery获取data-*属性值方法解析
Sep 01 jQuery
jquery自定义组件实例详解
Dec 31 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约瑟夫问题解决关于处死犯人的算法
2015/03/23 PHP
PHP实现随机发扑克牌
2020/04/22 PHP
文本加密解密
2006/06/23 Javascript
javascript学习笔记(十五) js间歇调用和超时调用
2012/06/20 Javascript
不同Jquery版本引发的问题解决
2013/10/14 Javascript
浅谈JavaScript中定义变量时有无var声明的区别
2014/08/18 Javascript
检测一个函数是否是JavaScript原生函数的小技巧
2015/03/13 Javascript
jQuery+css3动画属性制作猎豹浏览器宽屏banner焦点图
2015/03/16 Javascript
javascript给span标签赋值的方法
2015/11/26 Javascript
在JavaScript中使用JSON数据
2016/02/15 Javascript
如何使用AngularJs打造权限管理系统【简易型】
2016/05/09 Javascript
jQuery制作圣诞主题页面 更像是爱情影集
2016/08/10 Javascript
JS前端开发判断是否是手机端并跳转操作(小结)
2017/02/05 Javascript
使用bootstrap插件实现模态框效果
2017/05/10 Javascript
Puppet的一些技巧
2018/09/17 Javascript
Vue中 v-if 和v-else-if页面加载出现闪现的问题及解决方法
2018/10/12 Javascript
Vue+Koa2 打包后进行线上部署的教程详解
2019/07/31 Javascript
node.js使用 http-proxy 创建代理服务器操作示例
2020/02/10 Javascript
基于Vue全局组件与局部组件的区别说明
2020/08/11 Javascript
vue点击Dashboard不同内容 跳转到同一表格的实例
2020/11/13 Javascript
python入门之语句(if语句、while语句、for语句)
2015/01/19 Python
Python中的连接符(+、+=)示例详解
2017/01/13 Python
TensorFlow损失函数专题详解
2018/04/26 Python
pytorch对可变长度序列的处理方法详解
2018/12/08 Python
在PYQT5中QscrollArea(滚动条)的使用方法
2019/06/14 Python
Python实现朴素贝叶斯的学习与分类过程解析
2019/08/24 Python
Python lambda表达式filter、map、reduce函数用法解析
2019/09/11 Python
keras model.fit 解决validation_spilt=num 的问题
2020/06/19 Python
电子商务个人自荐信
2013/12/12 职场文书
投标保密承诺书
2014/05/19 职场文书
声乐专业大学生职业生涯规划书:理想的未来需要自己去打造
2014/09/20 职场文书
运动会广播稿200米(5篇)
2014/10/15 职场文书
2015年实习单位评语
2015/03/25 职场文书
2016年会开场白台词
2015/06/01 职场文书
房屋产权证明书
2015/06/19 职场文书
幼儿园小班开学寄语(2016秋季)
2015/12/03 职场文书