Question

我在这里有一个小提琴http://jsfiddle.net/BB3JK/47/，我从之前的问题（How can I move selected option in multiselect up and down by buttons using jquery?）改编而来。

我实际上是在AngularJS中编写代码，但我相信这个问题更基本。我有一个高10的选择框：

<select multiple id="selectedList" size="10">
    <option value="0">Chicago</option>
    <option value="1">Boston</option>
    <option value="2">Dallas</option>
    <option value="3">Atlanta</option>
    <option value="4">Yellow</option>
    <option value="5">Denver</option>
    <option value="6">Nashville</option>
    <option value="7">Orange</option>
    <option value="8">Baltimore</option>
    <option value="9">Crimson</option>
    <option value="10">Seattle</option>
    <option value="11">Orlando</option>
    <option value="12">Memphis</option>
    <option value="13">Cleveland</option>
    <option value="14">Phoenix</option>
    <option value="15">Amber</option>
</select>
<input type="button" value="Move Up">
<input type="button" value="Move Down">

我需要能够使用按钮上下移动选项。这一切都有效，但是当我从上到下移动一个选项时，它最终消失在选择框下方（即选择Denver然后不断点击Move Down）我希望选择框向下滚动并保持选中状态视野中的选项。

奇怪的是Move Up起作用（即选择底部的Amber和Move Up），但是Move Down不会！

我尝试过使用带有ScrollTop和AngularJS指令的jQuery，但我还没有发现任何有效的东西。

Answer 1

您可以使用javascript滚动到所选选项：

document.getElementById("mySelect").selectedIndex = 6;

我不知道移动项目的代码是怎么样的，但也许你可以在那里插入那行。

向上/向下移动时在窗口中保持选定的选项

1 个答案: