JavaScript/html自动完成文本框

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (95)

我正在开发一个网页,其中有许多自动完成文本框的要求。由于我刚开始使用javascript,我很难制作自己的自动完成文本框。我在网上搜索了很多例子,但它们只适用于一个文本框。这意味着我不能使用同一个js文件来创建另一个自动完成的文本框。我也没有在堆栈溢出中找到任何这样的例子。有人能帮我吗?

提问于
用户回答回答于

将JQuery与AutoSuggest插件结合使用。

http://docs.jquery.com/Plugins/autoComplete

包括JS库(请参阅上面的文档),然后用HTML进行如下操作:

<input type="text" class="autocomplete" name="n1" />
<input type="text" class="autocomplete" name="n2" />
<input type="text" class="autocomplete" name="n3" />
<input type="text" class="autocomplete" name="n4" />

然后在Javascript中向CSS-类添加一个自动完成:

var data = "Core Selectors Attributes Traversing Manipulation CSS Events Effects Ajax Utilities".split(" ");
$(".autocomplete").autocomplete(data);
用户回答回答于

这里有一个使用无jQuery或无JavaScript创建自动完成的解决方案。只是普通的HTML 5、一个输入框和一个dataList标记。

<input type="text" id="txtAutoComplete" list="languageList"/><!--your input textbox-->
<datalist id="languageList">
<option value="HTML" />
<option value="CSS" />
<option value="JavaScript" />
<option value="SQL" />
<option value="PHP" />
<option value="jQuery" />
<option value="Bootstrap" />
<option value="Angular" />
<option value="ASP.NET" />
<option value="XML" />
</datalist>

扫码关注云+社区

领取腾讯云代金券