javascript - How to get selected option value of dropdown using jquery? - Stack Overflow

admin管理员组

文章数量:1429091

I am using dropdown and I want to get value of selected option.

I am able to do that using jquery html() method.

But in case selected option value is containing html encodable character lets say it is &(ampersand.)

alert('html() : ' + $('#dropdown option:selected').html());

<script src=".11.0/jquery.min.js"></script>
<select id="dropdown">
<option selected>Test & Get knowledge</option>
</select>

I am using dropdown and I want to get value of selected option.

I am able to do that using jquery html() method.

But in case selected option value is containing html encodable character lets say it is &(ampersand.)

alert('html() : ' + $('#dropdown option:selected').html());

<script src="https://ajax.googleapis./ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<select id="dropdown">
<option selected>Test & Get knowledge</option>
</select>

Then this & is encoded to &a m p;

How to treat this value as only text?

• javascript
• jquery
• html

Share Improve this question Follow edited Dec 22, 2015 at 10:59 V.J. asked Dec 22, 2015 at 10:54 V.J.V.J. 92833 gold badges1818 silver badges3737 bronze badges 1

• You can use, .text() in that case. – Sahil Commented Dec 22, 2015 at 11:28

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 3

https://jsfiddle/programtheweba/8gohx47g/

By using Jquery text(), we will get only text and characters are not encoded.

alert('text() : ' +$('#dropdown').text());

<script src="https://ajax.googleapis./ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<select id="dropdown">
<option selected>Test & Get knowledge</option>
</select>

& is a special character in HTML (it's used for entities) and cannot appear as a normal character.
Your HTML is invalid (&x is not an entity), but the browser automatically corrects it to & as it is parsed.
jQuery faithfully returns the fixed-up HTML when you ask it to.

Source

Hence use .text() instead of .html():

$('#dropdown option:selected').text();

You can also use .val() along with select element selector to get selected options text value:

 $('#dropdown').val();

You can use jquery .text() instead:

console.log('text() : ' + $('#dropdown option:selected').text());//prints out text() : Test & Get knowledge

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="dropdown">
  <option selected>Test & Get knowledge</option>
</select>

You need to use .text() instead of .html():

$('#dropdown option:selected').text();

Or use .val()

$('#dropdown').val();

1. Include jQuery in your code.
2. Wrap your code in DOM Ready $(function(){ ... })
3. Use $('#dropdown option:selected').val() to fetch the value.

$(function(){
alert('html() : ' + $('#dropdown option:selected').val());
});

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="dropdown">
<option selected>Test & Get knowledge</option>
</select>

& will be parsed as & only and will not be changed.

本文标签： javascriptHow to get selected option value of dropdown using jqueryStack Overflow