有你在真好 的个人博客
文本框中的一些属性 提示信息和下拉菜单
阅读:2258 添加日期:2021/3/27 23:25:36 原文链接:https://www.toutiao.com/item/6427068168782479874/

文本框中的一些属性 提示信息和下拉菜单

文本框中的一些属性 提示信息和下拉菜单

placeholder属性

在一些文本框中,当用户还没在文本框中输入内容时,这个文本框就显示了对用户的提示信息,而当用户输入时,这些提示信息就会消失。实现这样的功能效果就需要用到placeholder属性,该属性的值就是框内的显示信息。

文本框中的一些属性 提示信息和下拉菜单

文本框中的一些属性 提示信息和下拉菜单

list属性

这个属性非常实用,它的文本框既可以允许用户输入内容,也可以让用户通过下拉菜单进行选择。list属性的值应该是一个,<datalist.../>组件的id,list属性必须与<datalist.../>元素结合使用。

<datalist.../>:该元素相当于一个看不见的<select.../>元素,用于生成一个隐藏的下拉菜单,<datalist.../>所能包含的子元素与<select.../>元素完全相同,该元素用于与指定了list属性的<input.../>元素结合使用。当双击文本框时,文本框会显示<datalist.../>生成的下拉菜单。

autocomplete属性

通过上面list属性双击文本框可以显示出下拉菜单,如果开发者不想让用户看到这些内容就需要通过autocomplete属性来实现,该属性支持如下两个属性值。

on:打开autocomplete,会显示下拉菜单。

off:关闭autocomplete,不会显示下拉菜单。

除了固定的下拉菜单外,还有用户输入过的内容,也可以出现在下拉菜单中。

ICP备案号:苏ICP备14035786号-1 苏公网安备 32050502001014号