编程笔记 html5&css&js 027 HTML输入属性(1/2)

@TOC(编程笔记 html5&css&js 027 HTML输入属性(1/2))

<input>元素除了type属性表示输入类型,后面还跟上其他属性,叫输入属性。

value 属性

value 属性规定输入字段的初始值:

html 复制代码
<form action="">
 First name:<br>
<input type="text" name="firstname" value="Bill">
<br>
 Last name:<br>
<input type="text" name="lastname">
</form> 

readonly 属性

readonly 属性规定输入字段为只读(不能修改):

html 复制代码
<form action="">
 First name:<br>
<input type="text" name="firstname" value="Bill" readonly>
<br>
 Last name:<br>
<input type="text" name="lastname">
</form> 

readonly 属性不需要值。它等同于 readonly="readonly"。

disabled 属性

disabled 属性规定输入字段是禁用的。

被禁用的元素是不可用和不可点击的。

被禁用的元素不会被提交。

html 复制代码
<form action="">
 First name:<br>
<input type="text" name="firstname" value="Bill" disabled>
<br>
 Last name:<br>
<input type="text" name="lastname">
</form> 

disabled 属性不需要值。它等同于 disabled="disabled"。

size 属性

size 属性规定输入字段的尺寸(以字符计):

html 复制代码
<form action="">
 First name:<br>
<input type="text" name="firstname" value="Bill" size="40">
<br>
 Last name:<br>
<input type="text" name="lastname">
</form> 

maxlength 属性

maxlength 属性规定输入字段允许的最大长度:

html 复制代码
<form action="">
 First name:<br>
<input type="text" name="firstname" maxlength="10">
<br>
 Last name:<br>
<input type="text" name="lastname">
</form> 

如设置 maxlength 属性,则输入控件不会接受超过所允许数的字符。

该属性不会提供任何反馈。如果需要提醒用户,则必须编写 JavaScript 代码。

注释:输入限制并非万无一失。JavaScript 提供了很多方法来增加非法输入。如需安全地限制输入,则接受者(服务器)必须同时对限制进行检查。

相关推荐
threelab2 小时前
Three.js 物理模拟着色器 | 三维可视化 / AI 提示词
开发语言·前端·javascript·人工智能·3d·着色器
武器大师722 小时前
lv_binding_js 代码解读
开发语言·javascript·ecmascript
Patrick_Wilson4 小时前
router.replace 之后紧跟 reload,页面为什么无限刷新?
javascript·react.js·浏览器
mONESY5 小时前
JavaScript 栈、队列、数组与链表核心知识点总结
javascript·面试
ZengLiangYi5 小时前
TypeScript 项目配置:tsconfig、ESM、路径别名
javascript·typescript·aigc
晓13135 小时前
【Cocos Creator 3.x】篇——第二章 入门
前端·javascript·游戏引擎
想要成为糕糕手5 小时前
前端必修课:JavaScript 数组与数据结构底层逻辑全解析
javascript·数据结构·面试
xiaofeichaichai6 小时前
React Hooks
前端·javascript·react.js
数据知道6 小时前
C++ 层拦截:修改 Blink 引擎与 V8 绑定的底层逻辑
javascript·数据采集·指纹浏览器·风控
2301_773643627 小时前
ceph镜像
前端·javascript·ceph