jQuery - 循环选择多个选项的选项文本

Question

我正在尝试从多个选择选项中提取文本,我已经设法使用以下代码拉出每个选项的值,但是当我使用时,.text()我得到所有选项文本,而不是选择的那个.

    $('#mySelects > .form-group select').each(function(){
            alert($(this).val());
    });

以下是以下示例HTML:

    <div id="mySelects" class="panel-body">
        <div class="form-group">
           <select name="select-1" id="select-1" class="form-control">
         <option selected="selected" value="0">Please Select</option>
         <option value="11700599">Test Value 1</option>
           </select>
        </div>

        <div class="form-group">
           <select name="select-2" id="select-2" class="form-control">
         <option selected="selected" value="0">Please Select</option>
         <option value="11700467">Test Value 2</option>
           </select>
   </div>

我当前的jQuery将返回:0, 0 我希望它返回:( "Please Select", "Please Select"或选择任何文本)

Answer 1

这是因为val(),当在<select>元素上调用时,将返回所选子元素的value属性<option>.但是,当您调用.text()时$(this),您将获取整个<select>元素本身内的所有文本节点.所以,请改用:

$('#mySelects > .form-group select').each(function(){
    var $optText = $(this).find('option:selected');
    alert($optText.text());
});

这是一个概念验证小提琴:http://jsfiddle.net/teddyrised/7vvX7/