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

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. Echarts动态加载饼状图实例(二)

    一.引入echarts.js文件(下载页:http://echarts.baidu.com/download.html) 二.HTML代码: <div class="ui-contai ...

  2. javascript继承之学习笔记

    今天记录一下学习javascript的继承. 继承基本上是基于“类”来说的,而javascript中并不存在真正的类,所以就出现了各种模拟“类”的行为,然后就堂而皇之的使用起了类的概念.这里不谈“类” ...

  3. 《算法》第五章部分程序 part 4

    ▶ 书中第五章部分程序,包括在加上自己补充的代码,Trie 树类,Trie 集合,三值搜索树(Ternary Search Trie) ● Trie 树类 package package01; imp ...

  4. Nginx 设置负载均衡

    1. 在nginx配置文件目录下另外单独创建一个文件用于管理负载均衡配置,这里起名为 fzjh.conf vim /etc/nginx/fzjh.conf #在文件下添加以下内容 upstream m ...

  5. 比较sql server两个数据库

    比较sql server两个数据库 http://opendbdiff.codeplex.com/ http://www.red-gate.com/ 有SQL Compare和SQL Prompt 开 ...

  6. Delphi 使用MD5 比对文件

    使用MD5的方法比对CXimage里图片是否改变: Delphi7实现方法: uses IdHashMessageDigest function TForm1.GetImageMD5(cxImage: ...

  7. input点击后的 默认边框去除

    转自 http://blog.sina.com.cn/s/blog_9f1cb4670102v47g.html css文件里加句话:*:focus { outline: none; } 或 input ...

  8. Servlet基本_Filter

    1.概念・サーブレットフィルタとは.サーブレットやJSPの「共通の前後処理」を記述するための仕組みです.・フィルタはサーブレットやJSPの前に位置し.実行前と後に.リクエスト.レスポンスに対して任意の ...

  9. C# 泛型可能导致的装箱操作陷阱

    代码如下,已解释 public bool TryGetValue(K key, out V value) { //注意这里,如果key是普通值类型,如int,key == null的判断会导致int的 ...

  10. 【BUG记录】记一次游戏越来越卡的BUG

    U3D的MOBA项目,测试过程中,10分钟以后,游戏帧率开始缓慢下降,约3-5分钟后,由60帧下降到小于10帧,编辑器模式. 打开profiler,看到CPU占用非常高,每帧都有24K的GC, 时间占 ...