【发布时间】:2012-11-28 18:21:58
【问题描述】:
我需要在我的 HTML 页面中实现一个下拉菜单,其中包含 2000 多个公司名称。在 html 页面中嵌入如此庞大的列表会使其变得庞大且加载缓慢。所以想知道是否有交互式OpenCPU/RApache 中的机制以交互方式获取相同内容。就像用户键入 A 一样,它应该显示所有以字母“A”开头的公司名称...
【问题讨论】:
标签: javascript html rapache opencpu
我需要在我的 HTML 页面中实现一个下拉菜单,其中包含 2000 多个公司名称。在 html 页面中嵌入如此庞大的列表会使其变得庞大且加载缓慢。所以想知道是否有交互式OpenCPU/RApache 中的机制以交互方式获取相同内容。就像用户键入 A 一样,它应该显示所有以字母“A”开头的公司名称...
【问题讨论】:
标签: javascript html rapache opencpu
在 HTML 页面中,在不重新加载页面的情况下以交互方式从服务器获取数据的唯一方法是使用 AJAX。您还可以创建一个数组来保存所有已获取的值,这样您就不必重新获取已获取的名称。
在服务器上,您需要创建一个页面,根据某些条件(例如用户键入的字母)返回企业名称列表。
更新
另外,您是否实际测试过一个包含 2000 项下拉菜单的页面?你知道它会很慢吗?如果每个项目有 40 个字符长,那将是 80K 的文本。浏览器可以在几毫秒内处理 80K。我认为这个问题不是加载时间的问题,而是迫使您的用户滚动浏览包含 2000 个条目的列表。
更新 2
我刚刚打开 Google 搜索“如何使用 php 创建 ajax 下拉菜单”。 Here's an example 与您的类似.. 涵盖了主要概念。虽然您会根据文本框上的 onkeyup 事件触发 AJAX 调用。
【讨论】:
你需要的是一个使用 jquery 的自动完成小部件:
http://jqueryui.com/autocomplete/
如果您想在没有任何 javascript 的情况下执行此操作,当然可以使用 html5 执行此操作,但有兼容性限制。
http://css-tricks.com/relevant-dropdowns-polyfill-for-datalist/
【讨论】:
我在我开发的基于 R 的 Web 应用程序中遇到了类似的问题。我需要为用户提供一个基于 12,000 个基因符号的选择列表,我想让他们输入部分符号。我最终使用了基于 JQuery 的Select2。您最终会使用从网页返回到 R 函数的 ajax 调用。就我而言,我在服务器端有一个函数,它在用户键入时接收字符并生成要返回的部分列表(以 JSON 格式)。我要求用户输入至少两个字符以使列表更小。它适用于我的应用程序。
【讨论】: