jQuery: how to get value of selected option in a table row

Question

Here is the part of the DOM I'm working with:

<tr id="player-row-973">
    <td class="display_name"> Kevin Love </td>
    <td class="position">
    <select id="position" name="position">
      <option value="pf">PF</option>
      <option value="c">C</option>
    </select>
   </td>
</tr>

Using jQuery, I'm trying to get the value of the position currently selected for the player Kevin Love. I've tried using something such as the following:

$('#player-row-973').find('#position').value() but that doesn't seem to do the trick.

Answer 1

关闭，其.val()

$('#player-row-973').find('#position').val()

Answer 2

I use this:

$('#player-row-973').find('#position option:selected').val();

For some reasons it does not always succeed with $('#selectId').val() .

Answer 3

firstly if you use ID you can directly select it like:

$('#position')

and get its value like:

$('#position').val()

but if you want to have multiple select options like this, you better remove the id attribute and use class or name , then you have all these alternatives to get the value:

using id attribute:

$('#position').val();
$('#position>option:selected').val();

using name attribute:

$('#player-row-973 select[name=position]').val()
$('#player-row-973 select[name=position]>option:selected').val()