用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 UI Grid 模态框中的表格实例代码
Apr 01 jQuery
详谈jQuery.load()和Jsp的include的区别
Apr 12 jQuery
jQuery表单验证之密码确认
May 22 jQuery
jQuery模拟实现天猫购物车动画效果实例代码
May 25 jQuery
jQuery实现可编辑表格并生成json结果(实例代码)
Jul 19 jQuery
jQuery ajax调用webservice注意事项
Oct 08 jQuery
jQuery 操作 HTML 元素和属性的方法
Nov 12 jQuery
jQuery无冲突模式详解
Jan 17 jQuery
jQuery设置下拉框显示与隐藏效果的方法分析
Sep 15 jQuery
jQuery实现轮播图源码
Oct 23 jQuery
jQuery带控制按钮轮播图插件
Jul 31 jQuery
使用jQuery实现购物车
Oct 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
56.com视频采集接口程序(PHP)
2007/09/22 PHP
PHP 计算代码执行耗时的代码修正网上普遍错误
2011/05/14 PHP
基于preg_match_all采集后数据处理的一点心得笔记(编码转换和正则匹配)
2014/01/31 PHP
Yii+MYSQL锁表防止并发情况下重复数据的方法
2016/07/14 PHP
Ajax提交表单时验证码自动验证 php后端验证码检测
2016/07/20 PHP
JavaScript获取onclick、onchange等事件值的代码
2013/07/22 Javascript
jQuery插件 selectToSelect使用方法
2013/10/02 Javascript
jQuery功能函数详解
2015/02/01 Javascript
js实现的简单radio背景颜色选择器代码
2015/08/18 Javascript
JavaScript统计字符串中每个字符出现次数完整实例
2016/01/28 Javascript
angularjs $http实现form表单提交示例
2017/06/09 Javascript
Javascript实现从小到大的数组转换成二叉搜索树
2017/06/13 Javascript
JS实现商品筛选功能
2020/08/19 Javascript
vue-scroller记录滚动位置的示例代码
2018/01/17 Javascript
vue.js图片转Base64上传图片并预览的实现方法
2018/08/02 Javascript
原生JS实现的简单小钟表功能示例
2018/08/30 Javascript
Vue实现table上下移动功能示例
2019/02/21 Javascript
vue中使用mxgraph的方法实例代码详解
2019/05/17 Javascript
在JavaScript中实现链式调用的实现
2019/12/24 Javascript
jQuery中event.target和this的区别详解
2020/08/13 jQuery
[45:25]完美世界DOTA2联赛循环赛 PXG vs IO 第一场 11.06
2020/11/09 DOTA
Python批量发送post请求的实现代码
2018/05/05 Python
Python实现ping指定IP的示例
2018/06/04 Python
解决pycharm工程启动卡住没反应的问题
2019/01/19 Python
浅谈python 中类属性共享的问题
2019/07/02 Python
Python Django 实现简单注册功能过程详解
2019/07/29 Python
python计算二维矩形IOU实例
2020/01/18 Python
python爬取股票最新数据并用excel绘制树状图的示例
2021/03/01 Python
For Art’s Sake官网:手工制作的奢华眼镜
2018/12/15 全球购物
港湾网络笔试题
2014/04/19 面试题
新年寄语大全
2014/04/12 职场文书
领导干部个人整改措施落实情况汇报
2014/10/29 职场文书
暑期实践个人总结
2015/03/06 职场文书
求职导师推荐信范文
2015/03/27 职场文书
2015年初三班主任工作总结
2015/05/21 职场文书
教你如何用cmd快速登录服务器
2022/06/10 Servers