自动完成文本输入 [英] Autocomplete text input

查看:33
本文介绍了自动完成文本输入的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我知道有很多 JavaScript 解决方案,但是有没有一种 HTML5 方法可以让文本输入具有自动完成功能?datalist 元素几乎就是我所追求的,除了它允许您输入自定义值而不是将您限制为列表中的内容.

I know there are a lot of JavaScript solutions, but is there an HTML5 method of having a text input with autocomplete? The datalist element is almost what I'm after, except it allows you to enter custom values rather than limiting you to what's in the list.

推荐答案

HTML5 有一个 autocomplete 属性,可以指定为 onoff 在一个字段中.

HTML5 has an autocomplete attribute which can be specified as either on or off in a field.

这是一个例子:

<form action="/form.php" autocomplete="on">
  First name:<input type="text" name="first_name"><br>
  Last name: <input type="text" name="last_name"><br>
  E-mail: <input type="email" name="email" autocomplete="off">
  <input type="submit">
</form>

它的工作方式是,当您在每个字段的 keyup 上访问此页面时,系统会向您建议您第一次提交的值.

The way it works is that the values that you submit the first time will be suggested to you on subsequent times you visit this page on keyup of each field.

  • 决定使用此功能的关键问题是浏览器兼容性之一.最好的办法是检查多个浏览器以确保其正常工作.caniuse.com 使支持看起来很糟糕,但我认为使用它来帮助那些拥有现代浏览器的人没有任何伤害.
  • The key issue in deciding to use this feature is one of browser compatibility. Your best bet is checking multiple browsers to make sure it works. caniuse.com makes the support looks pretty bad, but I don't see any harm it using it to help those who have modern browers.

来自 W3Schools 的关于 autocomplete 的其他事实,不要讨厌这种情况因为它确实涵盖了基础知识:

Other factoids about autocomplete from W3Schools, don't hate in this case as it does cover the basics:

  • 启用自动完成后,浏览器会自动完成值基于用户之前输入的值.
  • 可以表单自动完成开启",特定输入关闭"字段,反之亦然.
  • 自动完成属性适用于以及以下类型:文本、搜索、网址、电话、电子邮件、密码、日期选择器、范围和颜色.

这篇关于自动完成文本输入的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆