在项目中,经常会遇到,对文本框进行校验。

eg.  要求姓名长度为20,中文为10,只能输入中英文。

<input   maxlength="20" type="text" @blur="nameblur" v-model="name" placeholder="请输入姓名">

nameblur(e) {

let vm = this;

let userNameWrongAry = ['', '姓名输入有误,请重新输入', '请输入中文或者英文'];

function strLen(str) {

return (function (len) {

for (var i = 0; i < str.length; i++) {

var c = str.charAt(i);

if (/^[\u0000-\u00ff]$/.test(c)) //匹配双字节

{

len += 1;

} else {

len += 2;

}

}

return len;

})(0);

}

if (vm.name.trim() == '') {

weui.topTips(userNameWrongAry[0], {duration: 3000,});

return false;

}

if (strLen(vm.name.trim()) > 20) {

weui.topTips(userNameWrongAry[1], {duration: 3000,});

return false;

}

let parrent = /^[A-z\u4E00-\u9FA5\s]+$/g;

if (!parrent.test(vm.name.trim())) {

weui.topTips(userNameWrongAry[2], {duration: 3000,});

return false;

}

}

input 文本框,对中文长度校验的更多相关文章

  1. HTML input 文本框输入中文逗号自动转换为英文逗号

    input 标签中增加 onkeyup.onafterpaste 属性: <input type="text"placeholder="中文逗号自动转换为英文逗号& ...

  2. 我的插件のinput文本框实现宽度自适应

    先来最后结果:DEMO 介绍一下如何让一个文本框的宽度能够随着文本框中的内容的宽度增长而增长,也就是能够实现宽度自适应效果. 代码实例如下: <!DOCTYPE html> <htm ...

  3. jQuery限制文本框的输入长度

    jQuery限制文本框输入,包含粘贴. //限制文本框的输入长度 $(function () { $(document).on("keypress", ".txt-val ...

  4. jQuery实现限制文本框的输入长度

    jQuery限制文本框输入,包含粘贴. //限制文本框的输入长度 $(function () {  $(document).on("keypress", ".txt-va ...

  5. input文本框设置和移除默认值

    input文本框设置和移除默认值 这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失. 1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码: ...

  6. HTML input文本框设置和移除默认值

    这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失. 1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码: <input id=&quo ...

  7. input 文本框和 img 验证码对齐问题

    input 文本框和 img 验证码对齐问题 在网页制作中,常将 input 和 img 放在同一行,img标签总是比input高出一个头,非常难看. CCS实现input和img水平对齐的方法 同时 ...

  8. 捕获input 文本框内容改变的事件(onchange,onblur,onPropertyChange比较)

    input 文本框内容改变,可以使用onchange或者onblur来判断,但onchange是在文本内容改变,然后失去焦点的时发生,onblur是在失去焦点时发生,不会自己去判断. 如: <i ...

  9. chrome下input文本框自动填充背景问题解决

    chrome下input文本框会自动填充背景,只需要给文本框加一个样式即可解决问题 input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px ...

  10. 写了个限制文本框输入最大长度的jquery插件 - jquery.restrictFieldLength.js

    做了个限制文本框最大输入长度的jquery插件,效果图(共2个文本框,限制最多10个字符): 功能:当超出设置的最大字符长度后,会截断字符串.更改当前元素的css(会在1秒后还原css).支持长度超出 ...

随机推荐

  1. 3-scala高级

    1.模式匹配 //①简单表示: sign = ch match { case '+' => 1 case '-' => -1 case '_' => 0 } //②守卫:(case中 ...

  2. java使用zxing插件绘制二维码

    ZXing是一个开放源码的,用Java实现的多种格式的1D/2D条码图像处理库,它包含了联系到其他语言的端口.Zxing可以实现使用手机的内置的摄像头完成条形码的扫描及解码. 涉及到的依赖有: < ...

  3. 20165205 实验一 java开发环境的熟悉 实验报告

    20165205 实验一 Java开发环境的熟悉 一.实验报告封面 课程:Java程序设计 班级:1652班 姓名:刘喆君 学号:20165205 指导教师:娄嘉鹏 实验日期:2018年4月2日 实验 ...

  4. python3封装Api接口

    注:本篇的代码和语法基于Python3.5环境,下面将用到Python 的Flask框架 封装接口主要讲静态接口(无参数传入).动态接口(有参数传入,不同参数返回的信息不同).针对动态接口有三种传参方 ...

  5. 在Windows系统上一批可以下载但是需要经过编译再安装的第三方的直接编译后的版本(UCI页面)

    在Windows系统上一批可以下载但是需要经过编译再安装的第三方的直接编译后的版本(UCI页面) (https://www.lfd.uci.edu/~gohlke/pythonlibs/) win10 ...

  6. java abstract构造函数调用

    构造函数是对象的基本,没有构造函数就没有对象.如果在父类中(这里就是你的抽象类)中显示的写了有参数的构造函数,在子类继承是就必须写一个构造函数来调用父类的构造函数 public abstract cl ...

  7. JS获取QueryString(Jquery)

    QueryString = {      data: {},      Initial: function() {          var aPairs, aTmp;          var qu ...

  8. 解决Java Web项目中Word、Excel等二进制文件编译后无法打开的问题

    今天写新项目的时候遇到一个问题,在resources目录下存储的.xlsx文件,编译过后会增大几kb,无法打开. Google了一番之后,发现问题源自于maven-resources-plugin这个 ...

  9. UI5-Fiori初学者导航

    正文 你是UI5和Fiori的新手?来对地方了. 对我来说,今年是不得不“跟上时代”去提升自己ABAP世界以外的技术技能的困难的一年.幸运的是,有很多可免费获得的信息和课程可以帮你实现这个跳跃.不要等 ...

  10. cvc-complex-type.2.4.a: Invalid content was found starting with element 'async-supported'. One of '{"http://java.sun.com/xml/ns/javaee":init-param}' is expected.

    第一种方案:  将  "http://java.sun.com/xml/ns/javaee"  换为  "http://java.sun.com/xml/ns/j2ee& ...