javascript - 使用 jQuery 从一个选择框（选择的选项组和选项）中获取 2 个值

Question

有人可以帮我解决这个问题吗，我有一个看起来像这样的选择框：

<select name="scatid">
<optgroup label="June">
  <option>2005</option>
  <option>2006</option>
  <option>2007</option>
  <option>2008</option>
</optgroup>
<optgroup label="July">
  <option>2005</option>
  <option>2006</option>
</optgroup>

我也有一个空的输入框...

我想要实现的是，例如，如果我从选择框中选择 2008 年（6 月 optgroup）......输入框值自动获取文本“2008 年 6 月”（选择 optgroup 名称 + 选项）......等等。 .

有人可以给我一个例子，我怎样才能做到这一点？非常感谢你

Answer 1

只需使用值属性来给出你想要的值。

<select name="scatid">
<optgroup label="June">
  <option value="June 2005">2005</option>

Answer 2

附带条件是您实际上不想这样做：

$("#scatid").find("option:selected").parent().attr('label')

Answer 3

您可以通过读取元素的label属性来获取标签optgroup：

$('select[name="scatid"]').on('change', function(){
   var label = this.options[this.selectedIndex].parentNode.label;
   $('input[type=text]').val(label + ' ' + this.value);
});

http://jsfiddle.net/uEFx3/

Answer 4

使用 JQuery 试试这个：

$(function(){
$('select[name="scatid"]').change(function(){
    alert($(this).find('option:selected').parent('optgroup').attr('label')+'  '+$(this).val());
});
});