技术知识库

帮助中心 >  产品文档 >  网站相关 >  JS中动态限制用户输入字数代码

利用JS限制用户输入的字数一般用在留言板程序,最典型的就是发微博限制字数是140字。按照往常的思路就是在用户提交数据的时候使用JS对表单中的数据进行检测,如果有不符合规则的字段进行提示而且返回值为FALSE,最终阻止不合规则的数据提交并储存在数据库中。

这样做虽然可靠,但是用户体验不佳,因为在收到字数限制的提示后,用户还要返回进行重新编辑,并且再次重试提交,并不保证接下来提交的数据字数符合规则。

最好的方式就是在用户输入的同时对输入框中的字进行统计,如果超出字数,就无法继续输入。这样一来,提高了用户一次性提交成功的几率。

方式同样是使用JS的方式,但是事件的启用自然是在textarea中。代码如下:

<textarea onkeyup='value=value.substr(0,140);this.nextSibling.innerHTML=value.length+"/10";'></textarea><div>0/10</div>

预览的效果如下:

QQ图片20141105222735

QQ图片20141105222748

输入的时候,会在下方的数字显示输入的字符,如果超出就会自动被删除。


提交成功!非常感谢您的反馈,我们会继续努力做到更好!

这条文档是否有帮助解决问题?

非常抱歉未能帮助到您。为了给您提供更好的服务,我们很需要您进一步的反馈信息:

在文档使用中是否遇到以下问题: