How to get the value of a select with jQuery

admin January 4, 2021October 12, 2021 0 Comments get selected value of dropdown in jquery on change, jquery get label of selected option, jquery get selected option text, jquery get selected option text onchange, jquery get selected option value onchange, jquery select dropdown option by value

In this tutorial, we are going to see how to get the value of a select with jQuery. You can simply use the jQuery :selected selector with the method val() to find the value of the selected option in a drop-down list. Here is an example:

How to get the value of a select with jQuery

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>How to get the value of a select</title>
		<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
		<script type="text/javascript">
		$(document).ready(function(){
			$("select.language").change(function(){
				var language = $(this).children("option:selected").val();
				alert("You have selected the language : " + language);
			});
		});
		</script>
	</head> 
	<body>
		<form>
			<label>Select a language:</label>
			<select class="language">
				<option value="java">Java</option>
				<option value="php">PHP</option>
				<option value="python">Python</option>
			</select>
		</form>
	</body>
</html>

Result
Select a language:

If the value of an option is not set, the text of the <option> element will be used as the value.

How to get the value of a select with jQuery

You May Also Like

Show read more link if the text exceeds a certain length with jQuery

How to Loop Through Elements with the Same Class in jQuery

How to disable href link in jQuery

Leave a Reply Cancel reply