在选择中显示所选选项的第一个字符

时间:2014-01-08 08:32:59

标签: javascript html drop-down-menu

我有一个这样的选择框:

<select id="selectbox1">
  <option value="s">Second</option>
  <option value="m">Minute</option>
  <option value="h">Hour</option>
  <option value="d">Day</option>
  <option value="w">Week</option>
  <option value="t">monTh</option>
  <option value="y">Year</option>
</select>

我希望当我选择第一个选项second时,只有S出现在选择框中,依此类推。 当它打开另一个选择再次显示Second

1 个答案:

答案 0 :(得分:3)

试试这个:

添加一个隐藏选项,并在选择选项时取值的文本并插入隐藏选项,并每次强制选中它。

$('#selectbox1').on('change', function(){                                           
    var option = $(this).find('option:selected');
    $('.hide').text(option.val()).val(option.val());    
    $('.hide').data('value', option.text());
    $('.hide').attr('selected', true);        
});

要获取所选的选项valuetext,您可以:

$(this).find('option:selected').val();
$(this).find('option:selected').data('value');

<强> DEMO Link