javascript - 带有预输入和分层项的 Javascript 组合框

Question

我想创建一个带有分层项目列表的组合框。我需要能够单独选择父项和子项。我还需要能够为此组合框提供预输入功能。

例如，我想在 JS 中用这些数据制作一个组合框：

加拿大

——安大略

——魁北克

美国

——马萨诸塞州

——俄亥俄州

——德克萨斯

从这个下拉列表中，我希望能够单独选择任何一个省/州。我也希望能够选择“加拿大”而不选择它的孩子。

我已经尝试过 Select2 并且一直在挖掘 JQuery UI 以查看它是否可能，但到目前为止我还不能完全实现我需要的行为。我正在使用 bootstrap 编写此页面，但 boostrap 中给定的 typeahead 似乎根本不适用于组合框（我可以看到）。

score 3 · Accepted Answer

3

您可以使用 Chosen javascript 插件来实现这一点。 http://harvesthq.github.com/chosen/

于 2012-10-19T00:51:33.513 回答

score 0 · Accepted Answer

您可以为每个 typeahead 结果存储自定义 JS 对象，以便它可以显示和存储的不仅仅是字符串（例如类型或 ID）。使用它可以让您对国家与省/州有不同的逻辑。这是一个这样做的例子：

因此，在更新程序函数中，您可以根据自定义对象的逻辑来确定单击的是父对象还是子对象。

至于让父母看起来和孩子不同，我自己没有用过，但是bootstrap中有一个模板系统。查看此链接以获取示例：

您可能会使用它来区分父母和孩子的外观和感觉。

2 回答 2