This tutorial shows you how to get the selected text of a selectbox with the help of jQuery. We all know jQuery easing our work in many ways, if use old JavaScript method to get the Selected text, you should loop through all <option> one by one. But in jQuery this is pretty easy.
All you have to do is only this:
|
1 |
$( "#selectboxid option:selected" ).text(); |
Yes, this one line script will get you the selected text.
Here is the demo script, which shows you how to get the selected text onChange event of the select box:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<html> <head> <title>How to get Selected Text from Select box using jQuery</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script> $(function(){ $('#myselectbox').change(function(){ var selText = $('#myselectbox option:selected').text(); alert("You have selected: "+selText); }); }); </script> </head> <body> <select id="myselectbox"> <option value="1">Apple</option> <option value="2">Ball</option> <option value="3">Cat</option> <option value="4">Dog</option> </select> </body> </html> |
I hope this helped you today! Keep reading!
