0

How do I select an option from the HTML select box using jQuery? I am using select box (single choice), not drop-down. I need to get the choice value and the text.

Here is my code, but it's missing the jQuery function:

<html>
  <head>
    <script type='text/javascript'>
      val choiceVal = "None!";
      val choiceText = "None!";
      //So what is the function?
    </script>
  </head>
  <body>
    <select id="myListChoices">
      <option value="1">Choice 1</option>
      <option value="2">Choice 2</option>
      <option value="3">Choice 3</option>
    </select>
  </body>
</html>

More clarification: Please note that the goal in my question is to write a handler which would return the selected value and/or text on the click of the list item. So, for example, if the user clicks on the "Choice 2" in the page, the jQuery should somehow (how?) fire an alert or populate a variable with the selected value/text.

Boris
  • 9,986
  • 34
  • 110
  • 147

1 Answers1

0

You capture the change event for select lists.

$('select').on('change', function () {
    alert($('option:selected').val() +' : '+ $('option:selected').text());
});

In the above, we return the selected options val() and text() as per your needs.

Ohgodwhy
  • 49,779
  • 11
  • 80
  • 110