问题标签 [html-datalist]

（我找不到它，但话说回来我真的不知道如何搜索它。）

我想使用<input list=xxx>并<datalist id=xxx>获得自动完成功能，但我希望浏览器通过“包含”方法匹配所有选项，而不是“开始于”，这似乎是标准的。有办法吗？

如果不是简单的，有没有办法强制显示我想要显示的建议，而不是浏览器匹配的建议？假设我正在输入“foo”并且我想显示选项“bar”和“baz”。我可以将这些强加给用户吗？如果我只是用那些（使用 JS）填充数据列表，浏览器仍然会进行“开始于”检查，并将它们过滤掉。

我希望最终控制数据列表选项的显示方式。不是因为它的用户界面、灵活性、可访问性等，所以我不想完全改造它。甚至不建议使用 jQuery 插件。

如果我可以最终控制表单元素验证，为什么不能自动完成，对吧？

编辑：我现在看到 Firefox 确实使用“包含”方法......这甚至不是标准？有什么办法可以强制吗？我可以改变 Firefox 的方式吗？

编辑：我做了这个来说明我想要什么：http: //jsfiddle.net/rudiedirkx/r3jbfpxw/

• HTMLWG 的规范[list]
• W3的规格datalist
• 大卫沃尔什示例
• HONGKIAT 的行为总结..？

大家好，我有一个与数据列表相结合的 HTML5 输入，有没有办法在单击或输入输入框时显示整个列表。

例如，

带有数据列表和选项 {ab,ac,bb,bc} 的输入

输入 a 只会显示 ab 和 ac。我希望它仍然显示所有选项。

在 chrome 中，您可以单击一个小箭头来显示整个数据列表，但在 Firefox 中并非如此。

有没有办法在Firefox中做到这一点？

HTML - 尝试自动完成 = false，但不影响数据列表

http://jsfiddle.net/qapsjxx7/

控制器

检查此链接http://jsbin.com/jifibugeke/1/edit?html,js,console,output

上面提到了使用 angularjs 的 datalist 示例代码和 URL，这里我的问题是我输入的文本框，在控制器中添加通过添加每个单词，在我的 datalist 中选择的详细信息的要求仅显示在控制器中，

例如，我有这个数据列表：

如果他在列表中选择“第 1 页”时选择“第 1 页”，我如何将用户重定向到第 1 页。先谢谢了~！

我正在尝试datalist为旧浏览器实现一个具有内置后备功能的元素，如 w3 datalist 元素规范所示：

但是，具有相同名称的 an<input type="text">和 thedatalist两者的组合（回退所需）会导致“sex”参数在查询字符串中出现两次。

表单提交在 SO 代码片段中不起作用，因此请参阅此小提琴。提交“男性”时，网络选项卡会在提交时显示一个请求，上面写着http://www.example.com/?sex=male&sex=。

这会导致后端代码出现一些不稳定的行为（不幸的是，我现在无法修改）。如何在保持回退的同时防止双重参数？

目前，大多数主要浏览器（Safari 除外）都支持 HTML5<datalist>元素，这似乎是一种向输入添加建议的有趣方式。

但是，该value属性的实现与<option>. 例如：

这由不同的浏览器以不同的方式处理：

铬和歌剧：

火狐和 IE 11：

选择一个后，输入将填充值而不是内部文本。我只希望用户在下拉列表和输入中看到文本（“答案”），但42在提交时传递值，就像select会一样。

如何让所有浏览器的下拉列表显示<option>s 的标签（内部文本），但在提交表单时发送value属性？

我正在使用一个<datalist>

并使用 AJAX 填充列表

但是，当我单击数据列表中的选择时，我无法让它执行操作，例如，如果我输入“Ref F”并且出现“Ref flowers”项目，如果我单击它我需要执行一个事件。

我怎样才能做到这一点？

我正在使用 html datalist 来自动填充一些数据。我想要一种行为，它应该过滤除一个默认值之外的所有内容。下面是示例代码：

在上面的事情中，默认情况下，如果我输入 s，它只会显示 San Jose 和 San Francisco，当我输入 n 时，它只会显示 New York。

我的要求是，在任何情况下，无论键入什么，它都应该始终显示 San Jose（默认情况下），然后过滤其余元素。

示例：键入 B，应同时显示 San Jose 和 Boston，因为 San Jose 是我的默认值，Boston 是输入框中的过滤值。

这可能吗 ？如果没有，实现相同结果的替代方法是什么？

JSFiddle

如果需要，我可以使用 Javascript/Jquery。但是，我不能使用任何自动完成插件。

我正在尝试通过单击按钮动态地将行添加到 HTML 表中。

我的表格有一列包含 HTML5 datalist 元素。最初使用默认第一行加载页面时，我可以在 datalist 中看到下拉值。

但是对于按钮 datalist 添加的所有新行都不起作用。下面是我的表格和添加行的 JavaScript。JavaScript 中的 innerHTML 似乎不适用于 IE 中的 datalist 元素。是否有任何解决方法可以让 innerHTML 为 HTML5 元素工作？

HTML：

JavaScript：

现在我正在使用以下代码，但在 Chrome 上大约需要 10 秒，在 IE11 上大约需要 2 分钟，这是它最终会被使用的地方。

我正在阅读本教程：http ://blog.teamtreehouse.com/creating-autocomplete-dropdowns-datalist-element建议在处理较大数量时像这样使用ajax，但我不确定大是指100个项目还是100,000 件商品。

我一直试图通过替换来让它在字典中工作request.responseText，JSON.parse(JSON.stringify(dict));但我遇到了问题，因为它不在文件中，所以让它开始发出请求。

我该怎么做？如果我不应该为此使用 DataList，你推荐什么替代方案？

提前致谢。