1

我有一个选择下拉列表，其中可能包含一个大客户的 1000 多个项目。 

<select name="location" id="location">
    <option value="1">Store# 1257</option>
    <option value="2">Store# 1258</option>
    ...
    <option value="973">Store# 8200</option>
    <option value="974">Store# 8250</option>
    <option value="975">Store# 8254</option>
    <option value="976">Store# 8290 Fuel Center</option>
</select>

我还有一个文本框，当用户输入文本时，我想在下拉列表中移动所选项目。

例如，如果用户键入 82，那么我想移动到存在 82 的框中的第一个项目，其值为 973。如果用户键入 825，则移动到 974，等等。如果用户键入 Fuel，找到包含该字符串的第一个选项。

我目前使用 jquery 作为我的 javascript 库。

你有什么建议来解决这个问题？我应该切换到自动完成吗？如果是这样，我需要带有箭头的东西来下拉整个列表，因为某些客户可能只有 3 或 4 个可供选择。

谢谢。

4

2 回答 2

3

给定一个包含搜索字符串的变量searchFor，您可以使用此 jquery 片段选择包含该文本的第一个选项：

$("#location option[text*=" + searchFor + "]:first").attr("selected", true);

所以如果你有一个带有 id 的文本输入selectSearchBox，你可以这样写：

$("#selectSearchBox").keyup(function () {
     var searchFor = $(this).val();
     $("#location option[text*=" + searchFor + "]:first").attr("selected", true);
});
于 2009-03-06T11:59:09.930 回答
0

使用jQuery 自动完成插件可能是您的最佳选择。您可以在 SO 上查看先前的答案（请不要执行选择 => 数组转换，使用数组或服务器端脚本）。

于 2009-03-06T12:05:19.853 回答