将选中的选项设置为选择框中的第一个选项答案

【问题标题】：Set the selected option as the first option in the selectbox将选中的选项设置为选择框中的第一个选项
【发布时间】：2016-08-04 16:58:11
【问题描述】：

在 IE 中打开 this link 以准确了解我将要描述的行为并寻求破解。

我有以下选择列表：

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

当我在 IE 中呈现它时，与其他浏览器相比，它的下拉行为发生了变化被推送到下方（基于所选选项）

由于这是 IE 的默认行为，我正在寻找的是选项应该得到 重新排序，即应该制作用户选择的选项第一个选项。查看下图：

有人可以解决这个问题吗？

另外，如果有人知道改变这种默认 IE 行为的技巧，那么知道并了解这一点会很棒

这是正确的方法吗？

<!DOCTYPE html>
<html>
<head>
<script>
$(document).ready(function(){
var choose = $("#choose").bind('change',function(){alert("hello");
choose.find('option:selected').prependTo(choose);
});
});
</script>
<head>
<body>

<select id="choose">
<option value="choose">choose</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>

</body>
</html>

【问题讨论】：

你在用jQuery吗？
到目前为止我还没有，但是如果有办法使用 jQuery 来处理这个问题，我可以试试。

标签： html select internet-explorer-11 html-select default

【解决方案1】：

这是一个适用于 Jquery 的方法：

HTML

<select id = "choose">
    <option value="null" name="volvo">Volvo</option>
    <option value="1" name="saab">Saab</option>
    <option value="2" name="mercedes">Mercedes</option>
    <option value="3" name="audi">Audi</option>
</select>

jQuery

var choose = $("#choose").bind('change',function(){
    choose.find('option:selected').prependTo(choose);
});

(Source)

完整代码

<!DOCTYPE html>
<html>

<head>
  <script src="https://code.jquery.com/jquery-3.1.0.min.js" integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s=" crossorigin="anonymous"></script>
  <script>
    $(document).ready(function() {
      var choose = $("#choose").bind('change', function() {
        alert("hello");
        choose.find('option:selected').prependTo(choose);
      });
    });
  </script>

  <head>

    <body>

      <select id="choose">
        <option value="choose">choose</option>
        <option value="saab">Saab</option>
        <option value="opel">Opel</option>
        <option value="audi">Audi</option>
      </select>

    </body>

</html>

【讨论】：

这有帮助。感谢您的快速回复
这适用于 IE 11 吗？虽然功能绝对没问题。我无法在 IE 11 中完成这项工作
我在 IE 上启用了 JS。不确定还有哪些其他设置可能会阻止这种情况。您能否检查我的更新代码。我是否遗漏了代码中的某些内容？
我怎么能错过...谢谢

【解决方案2】：

    <html>
<head>
    <script src="jquery-3.1.0.js"></script>
    <script>
        $(function () {
            var selectedItem = $("#selectItem").bind('change', function () {
                selectedItem.find('option:selected').prependTo(selectedItem);
            });
        });
    </script>
    <head>
        <body>

            <select id="selectItem">
            <option value="1">one</option>
            <option value="2">two</option>
            <option value="3">three</option>
            <option value="4">four</option>
            </select>

        </body>
</html>

谢谢... :)

【讨论】：