今天写项目有问题。输入老师昵称时，需要控制输入框不能为空，字符长度有限制。英文字符不能超过20个，中文字符不能超过10个。进入课程介绍时，textarea只能输入中文和中文标点，长度不能超过100。使用框架是：百里香叶腊肠shiro。

搜索了很多数据，都找不到。现在具体实现如下：

[非空请求：]

这是一个很好的解决方案，只需在代码中添加lay-verify='required '，代码在layui的官方文档中，参考https://www.layui.com/doc/element/form.html

接下来，我们主要谈谈长度：

[效果]

解决方案：您需要编写自己的自定义表单。验证因为lay-verify:在layui中是表单验证的关键词

以下值可供选择：

必需(必需)

电话(手机号码)

邮件(邮箱)

Url(网址)

数量

日期

身份(身份证)

自定义值

没有满足要求的值，所以我们需要使用自定义值的方法

[代码如下：]

Html代码如下：

Label class='layui-form-label '教师昵称：/Label div class=' layui-input-block layui-width 21em '输入id=' username' name=' username '占位符='请输入昵称' class=' layui-input '自动完成=' off ' span Style=' color : red '(20个字符或10个汉字)/span/div

Js代码：

//自定义验证规则

form . verify({ cle ngth : function(value){ var I，sumsum=0；for(I=0；ivalue.lengthI){ if((value . charcodeat(I)=0)(value . charcodeat(I)=255))sum=sum 1；否则sum=sum 2；} if (sum 200) {return '教师档案最多只能有200个字符或100个汉字'；} }，nlength:函数(值){ var i，sumsum=0；for(I=0；ivalue.lengthI){ if((value . charcodeat(I)=0)(value . charcodeat(I)=255))sum=sum 1；否则sum=sum 2；} if (sum 20) {return '教师昵称最多只能是20个字符或10个汉字'；} } });});|

注意：必须在提交表格前写好，否则不起作用。

思路：计算文本内容中每个字符的unicode编码和，中文为双字符，英文为单字符。计算后判断总和，然后支付函数名输入，即lay-verify=" required | n length "(n length为自己取的名字)。

现在，让我们来解决下一个问题。在填写课程介绍时，判断长度不能超过200，只能像中文和中文标点一样。

[效果要求：]

Html代码：

Label class='layui-form-label '课程介绍：/label div class=' layui-input-block ' text area class=' layui-text area ' style=' height :200 px；width :800 px ' lay-verify=' required ' name=' content ' placeholder='请输入课程简介' th 3360 text=' $ { SW course . content } '/textarespan style=' color : red '(字符数控制在100个汉字以内，只能上传文本)/span

layui.use([ 'layer '，' jquery '，' form '，' upload '，' laytpl' ]，function(){ var $=layui。jqueryvar layer=layui . layer var lay TPL=layui。铺设第三方物流；var form=layui.form，upload=layui.upload//自定义验证规则形式。验证({ length :函数(值){ if(值)。长度20){ return '课程名称最多只能20个字；} }，字符s 3360函数(v){ var num sc=0；var char ASC=0；var 0 ACSC=0；for(var I=0；我。长度；I){ var ascinnumber=v . substr(I，1).charCodeAt()；if(ascinnumber=48 ascinnumber=57){ num sc=1；} if((ascinnumber=65 ascinnumber=90)| |(ascinnumber=97 ascinnumber=122)){ char ASC=1；} if((ascinnumber=33 ascinnumber=47)| |(ascinnumber=58 ascinnumber=64)| |(ascinnumber=91 ascinnumber=96)| | | |(ascinnumber=123 ascinnumber=126)){ othersc=1；} } if(num masc 0 | | char sc0 | | other sc0){ return '只能输入中文；} }，clength:函数（值){ var i，sumsum=0；for(I=0；ivalue.lengthI){ if((值。charcodeat(I)=0(值。charcodeat(I)=255)){ sum=sum 1；} else { sum=sum 2；} } if (sum 200) { return '课程介绍最多只能输入100个中文字；} } });|

最后将值付给文本区，即lay-verify="必需|字符|长度".

好的，现在就可以了（格式好难调，尴尬尴尬，)

各位如果有其他更好的方式，欢迎追加哦，小妹在此多谢了，有问题之处，还望能提出来！

以上这篇获得输入框只允许输入中文且判断长度的例子就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。