用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插件FusionCharts实现的3D帕累托图效果示例【附demo源码】
Mar 25 jQuery
jQuery EasyUI 组件加上“清除”功能实例详解
Apr 11 jQuery
JQuery EasyUI的一些常用组件
Jul 12 jQuery
jQuery EasyUI开发技巧总结
Sep 26 jQuery
jquery鼠标悬停导航下划线滑出效果
Sep 29 jQuery
jquery实现图片跟随鼠标的实例
Oct 17 jQuery
jQuery基于闭包实现的显示与隐藏div功能示例
Jun 09 jQuery
jQuery阻止事件冒泡实例分析
Jul 03 jQuery
jQuery实现根据身份证号获取生日、年龄、性别等信息的方法
Jan 09 jQuery
jquery获取img的src值实例介绍
Jan 16 jQuery
jQuery实现为table表格动态添加或删除tr功能示例
Feb 19 jQuery
jquery实现直播视频弹幕效果
Feb 25 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
迅雷下载《中学科技》怀旧期刊下载
2021/02/27 无线电
Zend公司全球首推PHP认证
2006/10/09 PHP
php session_start()出错原因分析及解决方法
2013/10/28 PHP
PHP快速按行读取CSV大文件的封装类分享(也适用于其它超大文本文件)
2014/04/10 PHP
PHP多维数组遍历方法(2种实现方法)
2015/12/10 PHP
thinkphp3.x自定义Action、Model及View的简单实现方法
2016/05/19 PHP
PHP封装的MSSql操作类完整实例
2016/05/26 PHP
jquery 学习笔记一
2010/04/07 Javascript
jQuery动画animate方法使用介绍
2013/05/06 Javascript
js实现屏蔽默认快捷键调用自定义事件示例
2013/06/18 Javascript
单击复制文字兼容各浏览器的完美解决方案
2013/07/04 Javascript
如何使用JS获取IE上传文件路径(IE7,8)
2013/07/08 Javascript
jquery实现一个简单好用的弹出框
2014/09/26 Javascript
JavaScript字符串对象fromCharCode方法入门实例(用于把Unicode值转换为字符串)
2014/10/17 Javascript
jquery的总体架构分析及实现示例详解
2014/11/08 Javascript
使用jQuery实现图片遮罩半透明坠落遮挡
2015/03/16 Javascript
JS实现为动态添加的元素增加事件功能示例【基于事件委托】
2018/03/21 Javascript
Vue微信项目按需授权登录策略实践思路详解
2018/05/07 Javascript
微信小程序用户位置权限的获取方法(拒绝后提醒)
2018/11/15 Javascript
JavaScript继承的特性与实践应用深入详解
2018/12/30 Javascript
VUE 实现动态给对象增加属性,并触发视图更新操作示例
2019/11/29 Javascript
windows下create-react-app 升级至3.3.1版本踩坑记
2020/02/17 Javascript
python3音乐播放器简单实现代码
2020/04/20 Python
Python基础学习之类与实例基本用法与注意事项详解
2019/06/17 Python
Python交互式图形编程的实现
2019/07/25 Python
python机器学习实现决策树
2019/11/11 Python
Python小程序之在图片上加入数字的代码
2019/11/26 Python
Python包,__init__.py功能与用法分析
2020/01/07 Python
Python GUI编程学习笔记之tkinter中messagebox、filedialog控件用法详解
2020/03/30 Python
西班牙鞋子和箱包在线销售网站:zapatos.es
2020/02/17 全球购物
英国书籍、CD、DVD和游戏的第一道德零售商:Awesome Books
2020/02/22 全球购物
简历的自荐信
2013/12/19 职场文书
创业计划书——互联网商机
2014/01/12 职场文书
2014年城市管理工作总结
2014/12/02 职场文书
个人委托函范文
2015/01/29 职场文书
解决Windows Server2012 R2 无法安装 .NET Framework 3.5
2022/04/29 Servers