js 获取input的value值及验证手机号和汉字的正则表达式

在项目中经常遇到需要验证输入内容的情况,可以通过 Javascript 判断输入内容,验证手机号或者是否为汉字。

简单的记录一下:

HTML部分:

<input type="text" name="name" id="name" placeholder="请输入您的姓名" value=""/>
<input type="number" name="mobile" id="mobile" placeholder="请输入您的手机号" value="">
<button id="button">提交</button>

js 部分:

首先获取到元素:

var uname = document.getElementById("name");
var umobile = document.getElementById("mobile");
var ubutton = document.getElementById("button");

判断用户名是否为空:

if(uname.value == ""){
    alert("请输入姓名!");
}

验证输入的是否是汉字:

var han = /^[\u4e00-\u9fa5]{2,9}$/; //设置汉字的正则表达式:2-9个汉字
if(!han.test(uname.value)){ //验证输入的内容是否是2-9个汉字
            alert("请输入汉字,不少于2个!");
}

验证手机号:

var myreg=/^[1][3,4,5,7,8][0-9]{9}$/; //设置手机号正则表达式
if(!myreg.test(umobile.value)){ //验证手机号格式是否正确
            alert("手机号格式不正确!");
}

拓展:JavaScript test() 方法

test() 方法用于检测一个字符串是否匹配某个模式。 

如果字符串中有匹配的值返回 true ,否则返回 false。

语法:

RegExpObject.test(string)

RegExpObject 验证规则。

string 要检测的字符串。

实例:在字符串中全局搜索 "Hello" 和 "Runoob" 字符串:

var str="Hello world!";
//查找"Hello"
var patt=/Hello/g;
var result=patt.test(str);
document.write("返回值: " +  result); 
//查找 "w3h5"
patt=/w3h5/g;
result=patt.test(str);
document.write("<br>返回值: " +  result);

以上实例输出结果:

返回值: true
返回值: false

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏码匠的流水账

聊聊nacos RaftCore的signalPublish

nacos-1.1.3/naming/src/main/java/com/alibaba/nacos/naming/consistency/persistent...

9320
来自专栏码匠的流水账

聊聊nacos address的postCluster

nacos-1.1.3/address/src/main/java/com/alibaba/nacos/address/controller/AddressSe...

6910
来自专栏V社 北京社

彻底搞懂Java动态代理

现在spring大行其道,经常使用的AOP功能就是动态代理机制的实现。动态代理到底是怎么回事呢?

7420
来自专栏网络技术联盟站

Maven教程,一篇带你走入“内行”!

简介:通过热部署配置,可以便捷地把本地项目发布到远程的 tomcat (发布会不用重启 tomcat 就能看到效果)

11420
来自专栏Spring相关

通俗易懂讲解一下代理模式

维基百科所说的优点抽象,这里我们简单来讲就是通过代理控制对象的访问,可以详细访问某个对象的方法,在这个方法调用处理,或调用后处理。

6920
来自专栏算法与编程之美

Java|粉丝答疑之Java编程题目

先来看看这个题,可以先写三个类。第一个类用来设置和获取员工的信息,第二个类写方法,包括查询,增加,删除等,第三个是测试。

12610
来自专栏服务端思维

从模版方法模式到 SPI 演变 :好的思想通用而持久

一般情况下,我们会通过 API 对外提供服务。这里,API 提供服务的接口的逻辑是固定的,换句话说,它具有通用性。但是,但我们遇到具有类似的业务逻辑的场景时,即...

5910
来自专栏算法与编程之美

Java|聊聊运算符中的“目”

Java是一门面向对象编程语言,不仅吸收了C++语言的各种优点,还摒弃了C++里难以理解的多继承、指针等概念,因此Java语言具有功能强大和简单易用两个特征。J...

10420
来自专栏码匠的流水账

聊聊rocketmq的ListenerContainerConfiguration

本文主要研究一下rocketmq的ListenerContainerConfiguration

8210
来自专栏未闻Code

一日一技:如何通过迭代器精简你的代码

假设有一个 Redis 集合,里面有 N 条数据,你不停从里面lpop数据,直到某一条数据的值为'Stop'字符串为止(已知里面必有一条数据为'Stop'字符串...

7930

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励