网页 input 与 textarea 限制输入长度

网页 input 与 textarea 限制输入长度

MilkeZhang > 笔记列表

阅读:232  点赞:1   评论:0


在设计这个网站得时候,有考虑过限制字符输入数量。第一是方便数据库设计,第二是也可以更好得做出归类,如标题长度限制,评论长度限制等。


之前得做法是在后台截取,但是效果不好,容易误导,所以查看了一下对应需要得代码,并做记录


针对 textarea

<textarea class="form-control" rows="4" placeholder="发布心情【仅限250字】" id="New_User_Mood" maxlength="250"></textarea>

上面是发布心情得代码,利用maxlength="250" 限制长度仅限250个字符


针对 input

1.限制输入框的长度

<input oninput="if(value.length>10)value=value.slice(0,10)">


2.限制输入框的大小

//限制最大值30

<input type="number" oninput="if(value>30)value=30" />

//限制最小值0

<input type="number" oninput="if(value<0)value=0" />


3.联合限制(限制长度和大小)

//长度2 最大值30 最小值0

<input type="number" oninput="if(value>30)value=30;if(value.length>2)value=value.slice(0,2);if(value<0)value=0" />


记性不好,记录一下


编写于:2021/8/5 12:28:50

版权声明

本站内容均来自网络转载或网友提供,如有侵权请及时联系我们删除!本站不承担任何争议和法律责任!







2022 年 5 月 7 日寒假伊始写给艾金森2021-12-18日记【哥斯拉入学报名】Analysis of the idea2022-04-14 日记【我,住院的第二天】2021-11-27 日记【公司过夜】清新柠檬不酸 的日记 2022/3/24 14:45:16扎克斯基德 的日记 2022/3/26 16:57:33死亡周结束了1日目平凡的琼斯 的日记 2022/1/15 21:57:50扎克斯基德 的日记 2022/4/22 16:09:19晓梦心雨 的记录 - 2021/12/18 11:51:35尔尔 的日记 2022/2/19 23:22:14半夜不睡觉写蛟龙易斩,雨线难画2022-05-11日记【两年小计划 V2】2022-02-17日记【戒烟一周】馬鹿なやつ2022.0326【用户反馈】2022-03-24 【时间显示问题】跟进结果考点考题梳理(17):项目成本管理考点考题梳理(23):战略管理与业务流程管理2022.0318虽然喜欢,但不是天才如何持续保持热情和激情?《学会提问》阅读2022.0421企业碳中和路径图—— 落实巴黎协定和联合国可持续发展目标之路三分钟热度 的笔记 2022/1/27 21:31:36考点考题梳理(19):项目人力资源管理C# 本地文件信息获取2020.0423不同人的痛苦是可以比较的吗生活/20220312 什么时候才能拿得起放得下Xamarin 字体大小和字体格式设置《一个人上东京》阅读C# 生成随机数考点考题梳理(12):项目生命周期和组织