根据所选选项更改同一选择中的选项

Question

如您所见，默认选择第一个选项（选项1）。 我想要做的是如果我选择选项2来更改他们的位置（将选项1添加到列表并设置选定的选项2）。

<select id="type" name="type" class="selectpicker" title="Option 1" value="1">
    <option>Option 2</option>
    <option>Option 3</option>
</select>

我的尝试：

$('.selectpicker').change(function() {
     var currentOptionValue = $('select option:selected').text();

     if (currentOptionValue == 'Option 2') {
         $(".selectpicker option[value="Option 2"]").text('Option 1');
     }
});

Answer 1

工作小提琴 。

我认为你在找什么：

$('.selectpicker').change(function() {
     var oldOptionText  = $('.selectpicker').attr('title');
     var oldOptionValue = $('.selectpicker').attr('value');

     var currentOptionText  = $('select option:selected').text();
     var currentOptionValue = $('select option:selected').attr('value');

     $('select option:selected').text(oldOptionText);
     $('select option:selected').attr('value', oldOptionValue);

     $('.selectpicker').attr('title', currentOptionText);
     $('.selectpicker').attr('value', currentOptionValue);
});

希望这可以帮助。

Answer 2

我觉得你喜欢这样的东西？

  $('.selectpicker').change(function() { var currentOptionValue = $('select option:selected').text(); if (currentOptionValue == 'Option 2') { $(".selectpicker").append(("<option>Option 1</option>")); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select id="type" name="type" class="selectpicker" title="Option 1" value="1"> <option>Option 3</option> <option>Option 2</option> </select>