js 如何校验手机号码呢?
手机号有如下规则:
(1)必须全为数字;
(2)必须是11位.(有人说还有10位的手机号,这里先不考虑);
(3)必须以1开头(有人见过以2开头的手机号吗?)
(4)第2位是34578中的一个.
js方法如下:
/***
* check mobile phone:(1)must be digit;(2)must be 11
* @param string
* @returns {boolean}
*/
telRuleCheck2 = function (string) {
var pattern = /^1[34578]\d{9}$/;
if (pattern.test(string)) {
return true;
}
console.log('check mobile phone ' + string + ' failed.');
return false;
};
通过正则表达式来校验
页面代码如下:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script type="application/javascript" src="jquery-1.11.1.js" ></script>
<script type="application/javascript" src="comm.js" ></script>
</head>
<body>
<div class="reg_con" style="position:relative;">
<label>联系电话</label>
<input id="telphone" type="text" name="userExt.telphone" value="13800000000" class="inp" maxlength="13"/>
<div id="telphone_tip" style="position:absolute;top:20px; color:#c00; font-weight:bold;">
</div>
</div>
<script type="application/javascript" >
$("#telphone").blur("blur",function(){
var telphone = $("#telphone").val();
if(telphone == ""){
$("#telphone_tip").html("提示：联系电话不能为空");
}
else
{
if(telRuleCheck2(telphone)){
$("#telphone_tip").html("");
}
else
{
$("#telphone_tip").html("联系电话格式不正确");
};
};
});
</script>
</body>
</html>
界面如下:
正则表达式说几点:
(1)^表示开头 ; $ 表示结尾;
(2)i表示忽略大小写;g表示全局匹配,而不是只匹配一次
(3)\d表示数字,即0123456789,\w表示26个字母;\s表示空格Tab换行等
进行web前端开发,会经常遇到校验文本框内容的情形.比如校验用户输入的手机号是否合法.
其实我们可以从根本上减少用户犯错的机会,比如文本框只能输入数字,若输入非数字字符,则马上被删除.
(现在让用户填写日期时都不会让用户手敲了,而是让用户从下拉框中选择,这同样是为了减少用户犯错的机会)
界面:
第一个文本框,输入字母时会立即被替换为空字符串.
核心js方法
/*
* 只能输入正整数,不能有小数点
*
*/
onlyIntegerKeyUp=function(e){
if(e===undefined){
e=window.event;
}
var obj=e.srcElement?e.srcElement:e.target;
var pattern = /[^\d]/ig;
var val=obj.value;
if(pattern.test(val)) {
var i=getCursortPosition(e);
obj.value=val.replace(pattern,'');
setCaretPosition(e,i);
}
};
/*******************************************************************************
* 获取光标位置
*
* @param ctrl
* @returns {Number}
*/
getCursortPosition=function(event) {// 获取光标位置函数
if (event === undefined || event === null) {
event = arguments.callee.caller.arguments[0] || window.event;
}
var obj = event.srcElement?event.srcElement:event.target;
var CaretPos = 0; // IE Support
if (document.selection) {
obj.focus ();
var Sel = document.selection.createRange ();
Sel.moveStart ('character', -obj.value.length);
CaretPos = Sel.text.length;
} else if (obj.selectionStart || obj.selectionStart == '0'){
// Firefox support
CaretPos = obj.selectionStart;
}
return (CaretPos);
};
/*******************************************************************************
* 设置光标位置
*
* @param ctrl
* @returns {Number}
*/
setCaretPosition=function(event, pos){// 设置光标位置函数
if (event === undefined || event === null) {
event = arguments.callee.caller.arguments[0] || window.event;
}
var obj = event.srcElement?event.srcElement:event.target;
if (pos > 0) {
pos = pos - 1;//因为把不匹配的字符删除之后,光标会往后移动一个位置
}
if(obj.setSelectionRange){
obj.focus();
obj.setSelectionRange(pos,pos);
} else if (obj.createTextRange) {
var range = obj.createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
}
};
/*
* 只能输入数字和字母
*
*/
onlyNumAndAlphKeyUp=function(event){
if(event===undefined){
event=window.event;
}
var obj=event.srcElement?event.srcElement:event.target;
var pattern = /[^\w]/ig;
if(pattern.test(obj.value)) {
var i=getCursortPosition(event);
obj.value=obj.value.replace(pattern,'');
setCaretPosition(event,i);
}
};
页面代码:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script type="application/javascript" src="jquery-1.11.1.js"></script>
<script type="application/javascript" src="comm.js"></script>
</head>
<body>
只能输入数字: <input type="text" onkeyup="onlyIntegerKeyUp(event)"/><br>
<br>
只能输入数字和字母: <input type="text" onkeyup="onlyNumAndAlphKeyUp(event)"/><br>
</body>
</html>
为什么会有getCursortPosition()和setCaretPosition()
因为通过js替换非法字符之后,光标的位置变化了.所以这两个方法用于在替换之前保存(记录)光标位置,替换之后恢复光标位置.
comm.js见附件
相关推荐
JavaScript正则表达式是用于匹配字符串模式的强大工具。在验证邮箱和手机号码时，我们需要创建符合特定规则的正则表达式。对于邮箱验证，通常的正则表达式如下： ```javascript var emailRegex = /^[a-zA-Z0-9._%...
### 正则表达式校验身份证号码 #### 知识点概述 身份证号码在中国大陆具有唯一性，用于标识每一个公民的身份。身份证号码分为15位和18位两种格式，其中18位号码是在15位基础上增加了一个4位出生年份以及一位校验码...
### 正则表达式在日期校验中的应用 #### 一、引言 在软件开发过程中，日期格式的校验是非常常见的需求之一。利用正则表达式进行日期格式的校验，不仅可以提高代码的可读性和简洁性，还能有效地确保输入数据的准确...
通过掌握以上知识点，开发者可以有效地利用正则表达式校验工具进行前端验证，确保用户输入的数据格式正确，从而提高应用程序的质量和用户体验。同时，熟练运用正则表达式还能提升开发效率，降低代码复杂性。在实际...
本文将围绕一个特定的正则表达式 `/^([A-Za-z0-9])+$/` 展开讨论，该表达式主要用于验证输入字符串是否仅包含数字和字母。 #### 正则表达式解析 该正则表达式 `/^([A-Za-z0-9])+$/` 可以被细分为几个关键部分进行...
在IT行业中，正则表达式是处理字符串时不可或缺的一部分，尤其在数据验证、文本提取等方面。在这个场景中，我们需要创建一个正则表达式来验证输入是否符合一年12个月份的格式。 首先，我们要明确一年中的12个月份的...
在JavaScript中，正则表达式同样发挥着重要作用，尤其是在Node.js环境中进行字符串模式匹配时。本文将详细介绍如何在JavaScript中使用正则表达式进行字符串的模式匹配、提取以及替换。 #### 二、基本概念 正则...
首先，我们需要获取用户输入的邮箱地址，然后使用正则表达式来判断输入的字符串是否符合邮箱地址的格式。如果输入的字符串不符合邮箱地址的格式，将弹出警告信息。 正则表达式 `/^\w+([-\.]\w+)*@\w+([\.-]\w+)*\.\...
例如，如果我们想验证一个字符串是否为有效的电子邮件地址，可以使用以下正则表达式： ```java String email = "example@example.com"; boolean isValid = email.matches("\\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\\....
在JavaScript编程中，正则表达式是一种强大的文本匹配工具，它可以用来校验字符串是否符合特定的模式。本文将详细介绍如何使用JavaScript中的正则表达式来校验指定字符串，确保字符串符合特定的格式要求。 首先，...
JavaScript正则表达式提供了一种强大的工具，用于前端数据校验，确保用户输入的数据格式正确无误。以下是从标题、描述、标签以及部分内容中提取的关键知识点，详细解释了如何使用JavaScript正则表达式进行各种常见...
正则表达式校验工具是帮助程序员和非程序员测试和调试正则表达式的实用工具，它能够快速验证一个正则表达式是否能正确匹配目标字符串。 正则表达式的基本概念： 1. 字符集：包括普通字符（如a-z、A-Z、0-9）和特殊...
接着，文章展示了如何使用正则表达式校验移动手机号码的合法性。传统的校验方法可能需要分步骤检查数字、位数以及第三位的要求。但使用正则表达式，我们只需要定义一个模式匹配串`var reg=/13[5,6,7,8,9]\d{8}/;`...
本资料“Javascript正则表达式校验共7页.pdf.zip”很可能详细介绍了JavaScript正则表达式的各种核心概念、语法和实例，旨在帮助开发者更好地理解和应用这一关键功能。 正则表达式主要包含以下几个核心概念： 1. **...
1. **模式测试**：用户可以输入待测试的正则表达式和对应的输入字符串，工具会展示是否匹配以及匹配的位置。 2. **步骤跟踪**：通过逐步执行正则引擎的匹配过程，帮助开发者理解正则表达式的匹配逻辑，尤其是在面对...
在JavaScript中，正则表达式主要用于测试一个字符串是否符合特定模式，从而判断其有效性。例如，我们可以使用正则表达式来检查电子邮件地址、电话号码、日期格式等是否符合预设规则。以下是一些常见的正则表达式模式...
"zzRegexTester"是一款专业的正则表达式校验工具，它集成了所有必要的正则表达式功能，对于开发人员来说，是测试和调试正则表达式的得力助手。 在使用正则表达式时，了解其基本语法和特殊字符至关重要。例如： 1. ...
这个正则表达式用于检查输入的字符串是否符合邮箱地址的一般规则，包括用户名、@符号、域名以及顶级域名。 2. 手机号码验证（中国大陆为例）： ```javascript const phoneRegex = /^1[3-9]\d{9}$/; ``` 中国的...