如下图所示：

邮政“邮政编码”字段，数据库中是varchar2（10）。

但是amazeui的页面校验中，关于字符长度的校验方式如下：

JS 表单验证

JS 表单验证基于 HTML5 的各项验证属性进行：

• required: 必填；
• pattern: 验证正则表达式，插件内置了 email、url、number 三种类型的正则表达式；
• minlength/maxlength: 字符限制；
• min/max: 最小、最大值限制，仅适用于数值类型的域；
• minchecked/maxchecked: 至少、至多选择数，适用于 checkbox、下拉多选框，checkbox 时将相关属性的设置在同组的第一个元素上；
• .js-pattern-xx: 验证规则 class，正则库中存在的规则可以通过添加相应 class 实现规则添加。

注意：

HTML5 原生表单验证中 pattern 只验证值的合法性，也就是可以不填，如果填写则必须符合规则。如果是必填项，仍要添加 required 属性。该插件与 HTML5 的规则保持一致。
 

<!-- 下面三种写法等效 -->
<!-- 只内置了 email url number 三种类型的正则，可自行扩展 -->
<input type="email"/>
<!-- js-pattern-xx 其中 xx 为 pattern 库中的 key -->
<input type="text" class="js-pattern-email"/>
<input type="text" pattern="^(...email regex...)$"/>

即maxlength=10,amazeui的意思是可以输入10个字（数字、字母、汉字等同对待，都视为一个字）

但是假如前段输入了10个汉字”中中中中中中中中中中“，提交后肯定数据库长度溢出，因为该字段数据库的长度是varchar2（10）即10byte只能存3.3333个不到4个汉字（因为一个汉字如果GBK\GB2312编码占2个字节，但是unicode\utf-8编码占3个字节）。
 

所以仅maxlength=10不能正确的限制输入，还要加上js-pattern-number这个限制（这个确保输入的是整数，这样汉字就输入不进去了）。

总结

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

猜你喜欢

• CSS中动画的基础知识是什么，怎样实现奔跑小熊的动画

  CSS如何实现动画一？什么是动画？动画就是一帧又一帧图片,按顺序展现在人的眼前，但是由于人的视觉反应不过来就会产生图画动起来的效果。下文有实例供大家参考，对大家了解操作过程或相关知识有一定的帮助，而且实用性强，希望这篇文章能帮助大家，下面我们一起来了解看看吧。

• HTML5移动端页面如何禁止虚拟键盘弹出来

  这篇文章主要介绍了Html5页面上如何禁止手机虚拟键盘弹出,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧

• flex布局中的缩放如何理解？缩放比例要怎样计算？

  这篇文章给大家分享的是有关flex布局以及缩放的内容，flex布局是比较实用的，但是对于flex布局比例计算，一些朋友不是很了解，对此这篇文章就给大家来详细的介绍，感兴趣的朋友可以参考一下，接下来一起跟随小编看看吧。

• 详解使用css实现fullpage.js全屏滚动

  全屏滚动效果是网页设计中比较常见的，能用户良好的视觉和交互体验。一般我们用fullpage.js来实现全屏滚动，fullpage.js是一个基于jQuery的插件，能够轻松制作出全屏网站。其实CSS也能实现全屏滚动效果，下面我们来具体看看。

• CSS常用效果有哪些，实现代码是什么

  最近翻阅网上资料，查到了一些自己从未用过的CSS，于是记录下来，在有些时候兴许能用得上。1、CSS中简单的运算我们通常用css指定的是静态的结果，而动态结果，如高度，位置等等则需要js来动态进行计算赋值，而其实css自己也能够进行简单的运算，主要是用到了calc这个函数。.div{width:calc(100%-50px);}2、使用CSS实现文字 ...