EN
jQuery - get selected option text from dropdown select
14
points
In this article, we would like to show you how to get selected option text from dropdown select using jQuery.
Quick solution:
var text = $('#my-dropdown-id option:selected').text();
or:
var text = $('#my-dropdown-id').find(":selected").text();
Practical example
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
</head>
<body>
<select id="my-dropdown-id">
<option value="1">Blue</option>
<option value="2" selected>Green</option>
<option value="3">Red</option>
<option value="4">Yellow</option>
</select>
<script>
$(document).ready(function() {
var text1 = $('#my-dropdown-id option:selected').text();
console.log("text1: " + text1);
var text2 = $('#my-dropdown-id').find(":selected").text();
console.log("text2: " + text2);
});
</script>
</body>
</html>