发表新帖
发表新帖

Get selected text from a drop-down list (select box) using jQuery

前端 未结
关注
30 1682
南方客
南方客 2020-11-21 15:58

How can I get the selected text (not the selected value) from a drop-down list in jQuery?

相关标签:
30条回答
  • 深忆病人
    2020-11-21 16:28

    This work for me:

    $("#city :selected").text();

    I'm using jQuery 1.10.2

    0 讨论(0)
  • 醉酒成梦
    2020-11-21 16:30 
     $("#selectID option:selected").text();

    Instead of #selectID you can use any jQuery selector, like .selectClass using class.

    As mentioned in the documentation here.

    The :selected selector works for <option> elements. It does not work for checkboxes or radio inputs; use :checked for them.

    .text() As per the documentation here.

    Get the combined text contents of each element in the set of matched elements, including their descendants.

    So you can take text from any HTML element using the .text() method.

    Refer the documentation for a deeper explanation.

    0 讨论(0)
  • 后悔当初
    2020-11-21 16:30

    Try:

    $var = jQuery("#dropdownid option:selected").val();
   alert ($var);

    Or to get the text of the option, use text():

    $var = jQuery("#dropdownid option:selected").text();
   alert ($var);

    More Info:

    • http://api.jquery.com/val/
    • http://api.jquery.com/text/
    0 讨论(0)
  • 终归单人心
    2020-11-21 16:30 

    $(function () {
  alert('.val() = ' + $('#selectnumber').val() + '  AND  html() = ' + $('#selectnumber option:selected').html() + '  AND .text() = ' + $('#selectnumber option:selected').text());
});
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head runat="server">
    <title></title>

  </head>
  <body>
    <form id="form1" runat="server">
      <div>
        <select id="selectnumber">
          <option value="1">one</option>
          <option value="2">two</option>
          <option value="3">three</option>
          <option value="4">four</option>
        </select>

      </div>
    </form>
  </body>
</html>

    0 讨论(0)
  • 栀梦
    2020-11-21 16:30

    For multi-selects:

    $("#yourdropdownid :selected").map(function(i, v) { return $.trim($(v).text()); }
    0 讨论(0)
  • 孤街浪徒
    2020-11-21 16:31

    In sibling case 

    <a class="uibutton confirm addClient" href="javascript:void(0);">ADD Client</a>
<input type="text" placeholder="Enter client name" style="margin: 5px;float: right" class="clientsearch large" />
<select class="mychzn-select clientList">
  <option value="">Select Client name....</option>
  <option value="1">abc</option>
</select>


 /*jQuery*/
 $(this).siblings('select').children(':selected').text()
    0 讨论(0)
 看不清?
提交回复
热议问题