用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实现图片上传前本地预览
Apr 28 jQuery
jQuery输入框密码的显示隐藏【代码分享】
Apr 29 jQuery
基于jQuery和CSS3实现APPLE TV海报视差效果
Jun 16 jQuery
jQuery实现可拖动进度条实例代码
Jun 21 jQuery
jQuery Validate插件ajax方式验证输入值的实例
Dec 21 jQuery
jQuery实现的响应鼠标移动方向插件用法示例【附源码下载】
Aug 28 jQuery
为jquery的ajax请求添加超时timeout时间的操作方法
Sep 04 jQuery
[jQuery] 事件和动画详解
Mar 05 jQuery
一文快速了解JQuery中的AJAX
May 31 jQuery
jquery实现图片无缝滚动 蒙版遮蔽效果
Jan 11 jQuery
jquery+css3实现的经典弹出层效果示例
May 16 jQuery
jQuery 选择方法及$(this)用法实例分析
May 19 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中长文章分页显示实现代码
2012/09/29 PHP
php+xml实现在线英文词典查询的方法
2015/01/23 PHP
PHP实现仿Google分页效果的分页函数
2015/07/29 PHP
用Laravel Sms实现laravel短信验证码的发送的实现
2018/11/29 PHP
PHP调用接口API封装的例子
2019/10/11 PHP
Laravel配合jwt使用的方法实例
2020/10/25 PHP
在标题栏显示新消息提示,很多公司项目中用到这个方法
2011/11/04 Javascript
js实现杯子倒水问题自动求解程序
2013/03/25 Javascript
js 获取屏幕各种宽高的方法(浏览器兼容)
2013/05/15 Javascript
JS截取字符串常用方法整理及使用示例
2013/10/18 Javascript
javascript event在FF和IE的兼容传参心得(绝对好用)
2014/07/10 Javascript
jquery实现仿新浪微博带动画效果弹出层代码(可关闭、可拖动)
2015/10/12 Javascript
Windows下快速搭建NodeJS本地服务器的步骤
2017/08/09 NodeJs
JS实现快速比较两个字符串中包含有相同数字的方法
2017/09/11 Javascript
轻量级JS Cookie插件js-cookie的使用方法
2018/03/22 Javascript
vue--点击当前增加class,其他删除class的方法
2018/09/15 Javascript
el-select数据过多懒加载的解决(loadmore)
2019/05/29 Javascript
vue监听用户输入和点击功能
2019/09/27 Javascript
手把手教您实现react异步加载高阶组件
2020/04/07 Javascript
如何基于layui的laytpl实现数据绑定的示例代码
2020/04/10 Javascript
Vue为什么要谨慎使用$attrs与$listeners
2020/08/27 Javascript
python中getaddrinfo()基本用法实例分析
2015/06/28 Python
使用python爬虫实现网络股票信息爬取的demo
2018/01/05 Python
Python numpy 点数组去重的实例
2018/04/18 Python
通过Py2exe将自己的python程序打包成.exe/.app的方法
2018/05/26 Python
Python面向对象之类的定义与继承用法示例
2019/01/14 Python
python函数参数(必须参数、可变参数、关键字参数)
2019/08/16 Python
Window10下python3.7 安装与卸载教程图解
2019/09/30 Python
200行python代码实现贪吃蛇游戏
2020/04/24 Python
Python操作dict时避免出现KeyError的几种解决方法
2020/09/20 Python
印尼最大的婴儿用品购物网站:Orami
2017/09/28 全球购物
名词解释WEB SERVICE,SOAP,UDDI,WSDL,JAXP,JAXM;JSWDL开发包的介绍。
2012/10/27 面试题
公司面试感谢信
2014/02/01 职场文书
医学专业职业生涯规划范文
2014/02/05 职场文书
2015年招生工作总结
2015/05/04 职场文书
Python编写nmap扫描工具
2021/07/21 Python