具有数百个选项的选择可能会替换UI吗?

时间:2015-04-28 09:51:40

标签: jquery html html5 user-interface

我正在将旧的Access 2003应用程序转换为内部项目的Web应用程序,其中一个最流行的UI元素是select,其中包含数百个元素。例如,想象一下由捐助者给出的礼物的数据网格,其中一列是选择哪个出版物(由select表示)被发送给该特定礼物的特定恩人的选项。但是在每一行中,每次都重复相同的select

我担心重复这种模式(首先,因为它很丑陋),因为它可能对浏览器的性能产生影响,最重要的是,因为它可能会引入UX。有什么方法可以用更现代的行为取代这种范式?我想,例如,关于放置一个<input type="text">触发一个模态,提供所有可能的选项。

3 个答案:

答案 0 :(得分:1)

请在github上查看select2.js project,看起来很完美。

  

Select2为您提供了一个可自定义的选择框,支持搜索,标记,远程数据集,无限滚动以及许多其他高度使用的选项。

它集成了自动完成功能(行为类似<input type="text">),是javascript,hugh社区的趋势项目之一。

答案 1 :(得分:1)

就UI而言,像这样的东西作为自动完成功能会更好。

更广泛使用的一个是jQuery UI's。这也使您能够根据用户输入的内容通过远程数据源加载数据。

答案 2 :(得分:1)

您可以选择一个包含所有选项并在整个过程中使用它。当您编辑(或者可能将鼠标悬停在该行)时,基本上将当前行选择与实际选择以及所有选项进行交换。完成编辑后,用一个只有一个选项(选择的选项)的虚拟选择替换选择。

瞧!没有大型DOM或没有极端页面加载。它原则上与你的建议类似,但它看起来像一个普通的旧页面。