Home > Article > Web Front-end > How to get the option value in the select tag in jquery

How to get the option value in the select tag in jquery

亚连Original: 2018-06-09 14:32:344350browse

Below I will share with you an example of using jquery to obtain the selected option value and text in the select tag. It has a good reference value and I hope it will be helpful to everyone.

1. If you want to use jquery, you must first introduce the jquery file into html or jsp.

# 2. Without further ado, let’s get into the code.

<%@ 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>
		<p>
			<select id="sel" onchange="doSome();">
				<option value="aa">bb</option>
				<option>cc</option>
			</select>
		</p>
	</body>
</html>

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Explain the Object object in detail in JS

How to use vue.js to realize that the pop-up box only plays once

Detailed interpretation of the trie prefix tree in javascript

Detailed interpretation of todoMVC code in Vue

In How to dynamically add and get the style name in jquery

How to implement parent-child component communication in Angular2

How to create logistics in D3.js Map (detailed tutorial)

NavigatorIOS component in React Native (detailed tutorial description)

About how to use ejsExcel template

The above is the detailed content of How to get the option value in the select tag in jquery. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：How to integrate Bootstrap 4 in Laravel?Next article：How to integrate Bootstrap 4 in Laravel?

See more

How to get the option value in the select tag in jquery

Related articles