文章目录
- 1. 背景
- 2. disabled:禁用
- 3. readonly:直读
- 4. checked:选中
- 5. maxlength:最大输入字符数
- 6. 小结
1. 背景
上一篇我们讲了表单元素的两个属性id和name，其实表单元素还有其他几个常用属性，我们逐一介绍。
2. disabled:禁用
disabled属性表示禁用该元素，注意奇怪的是，只要写上这个属性（不论值如何），元素就会被禁用。
例子：
<body>
正常元素：
<input type="text">
<br>
禁用:
<input type="text" disabled>
</body>
效果如下：
禁用元素后，元素变为灰色，且不可输入内容。
3. readonly:直读
readonly属性将元素设置为只读，不能输入内容。跟disabled相比，readonly并不会让元素变为灰色。
<body>
正常元素：
<input type="text">
<br>
只读(无法输入内容):
<input type="text" readonly>
</body>
4. checked:选中
checked应用于单选框、复选框、下拉菜单元素，表示某个选项被选中。
<body>
选择性别
<input type="radio" name="sex" checked> 男
<input type="radio" name="sex" checked> 女
<hr>
选择爱好
<input type="checkbox" name="hobby" checked>篮球
<input type="checkbox" name="hobby" checked>足球
<input type="checkbox" name="hobby">乒乓球
<hr>
选择省份
<select>
<option checked>山东省</option>
<option>陕西省</option>
<option>湖北省</option>
<option>湖南省</option>
</select>
</body>
效果如下：
5. maxlength:最大输入字符数
maxlength属性值是一个数字，用来设置元素最多可以输入多少字符。
<body>
10个字符之后，无法输入
<input type="text" maxlength="10">
</body>
6. 小结
这些属性使用后，还是有点作用的。
