Jquery：从一组下拉框中，从选定的下拉框中获取选定的值答案

【问题标题】：Jquery: From a group of drop down boxes, get selected value from a chosen drop down boxJquery：从一组下拉框中，从选定的下拉框中获取选定的值
【发布时间】：2017-07-27 16:02:25
【问题描述】：

我有许多具有不同 ID 的下拉框。

$("select").change(function(e) {
  alert($(this).val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>
      <select id='priceType1' name='priceType1'>
        <option value='SRP'>SRP</option>
        <option value='DP'>DP</option></select>
    </td>
  </tr>

  <tr>
    <td>
      <select id='priceType2' name='priceType2'>
            <option value='SRP'>SRP</option>
            <option value='DP'>DP</option></select>
    </td>
  </tr>

  <tr>
    <td>
      <select id='priceType3' name='priceType3'>
            <option value='SRP'>SRP</option>
            <option value='DP'>DP</option></select>
    </td>
  </tr>
</table>

现在，每当我从下拉菜单中选择一个选项时，我将如何获得所选值。我已经尝试了下面的代码，但它不起作用。我需要在 jquery 中执行此操作，因为我希望在获取所选值后有一个 ajax 代码。

【问题讨论】：

这段代码可以工作
@Vineesh 我知道它应该可以工作，但是每当我更改选项时都没有警报。
您的代码有效，有什么问题？你能描述一下场景和预期的行为吗
您可以在jsfiddle.net/e14muw6x 进行验证，我想您忘记包含 jquery 库
jsfiddle.net/rhc1yhvd有警报

标签： javascript jquery html drop-down-menu

【解决方案1】：

这是工作代码。使用on() 和change。您可以获得选定的值，以及所有 3 个选择下拉列表的值。：

$("select").on('change', function() {
  console.log('Selected Value' + $(this).val());
  $("select option:selected").each(function(k, v) {
    console.log('Option ' + k + ' Value: ' + $(this).val());
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>
      <select id='priceType1' name='priceType1'>
    <option value='SRP'>SRP</option>
    <option value='DP'>DP</option></select>
    </td>
  </tr>

  <tr>
    <td>
      <select id='priceType2' name='priceType2'>
        <option value='SRP'>SRP</option>
        <option value='DP'>DP</option></select>
    </td>
  </tr>

  <tr>
    <td>
      <select id='priceType3' name='priceType3'>
        <option value='SRP'>SRP</option>
        <option value='DP'>DP</option></select>
    </td>
  </tr>
</table>

【讨论】：

【解决方案2】：

Your code is correct but add select box change event written in document ready function ? that is the mistake.

jQuery

<script>
$(document).ready(function(){

    $("select").change(function(e){
        alert($(this).val());
    });

});
</script>

【讨论】：