计算输入手机号码数、验证多号码、过滤重复号码

最新推荐文章于 2022-05-08 11:46:10 发布

weixin_30478619

最新推荐文章于 2022-05-08 11:46:10 发布

阅读量232

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/wxw1314/p/5885729.html

版权

html代码：

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <title></title>
 5 
 6 <style type="text/css">
 7 #content #contentmain table tbody tr td {
 8 border:0;
 9 height:28px;
10 }
11 #content #contentmain table{
12 text-align: left;
13 width:100%;
14 }
15 .tabel_2{padding:10px;}
16 .coninf table td{line-height: 30px;}
17 .coninf table{width: 100%;line-height: 25px;border-collapse: collapse;}
18 .wxw-table{margin-bottom: 10px;}
19 .wxw-table td{border: 1px solid #c5c5c5;height: 28px;text-align: center;}
20 
21 </style>
22 <script src="http://code.jquery.com/jquery-1.4.1.min.js"></script>
23 </head>
24 <body>
25 <div id="content">
26 <div id="contentmain">
27 <form>
28 <table class="tabel_2" >
29 <tbody>
30 <tr style="border-top:1px solid #ccc;">
31 <td align="right" valign="top" style="padding-top:10px;">手机号码：</td>
32 <td style="padding-top:10px;">
33 <textarea rows="3" cols="50" class="phones"></textarea>
34 </td>
35 </tr>
36 <tr>
37 <td></td>
38 <td class="phone_num">
39 共计号码：<span style="color:red">0</span>个
40 </td>
41 </tr>
42 <tr>
43 <td></td>
44 <td >
45 <input type="button" name="" value="过滤错号" class="querybtn" id="wrongNumber">
46 <input type="button" name="" value="重号过滤" class="querybtn" id="repeatNumber">
47 <input type="button" name="" value="二次过滤" class="querybtn" id="doubleNumber">
48 </td>
49 </tr>
50 </tbody>
51 </table>
52 </form>
53 </div>
54 </div>
55 
56 </body>
57 </html>

界面如下：

js代码：

<script type="text/javascript">
//计算号码
var $phone = $(".phones");
var ie = jQuery.support.htmlSerialize;
if(ie){
$phone[0].oninput = calculatePhone;
}else{
$phone[0].onpropertychange = calculatePhone;
}
function calculatePhone(){
if($(".phones").val().indexOf(",")>=0){
var strAry = $(".phones").val().split(",") ;
}else{
var strAry = $(".phones").val().split("\n");
};
$(".phone_num").html("共计号码：<span style='color:red'>"+strAry.length+"</span>个");
}

//过滤错号
$("#wrongNumber").click(function(){
if($(".phones").val().indexOf(",")>=0){
var strAry = $(".phones").val().split(",") ;
}else{
var strAry = $(".phones").val().split("\n");
};
wrong_num(strAry)
})
//重号过滤
$("#repeatNumber").click(function(){
if($(".phones").val().indexOf(",")>=0){
var strAry = $(".phones").val().split(",") ;
}else{
var strAry = $(".phones").val().split("\n");
};
uniQueue(strAry); 
}); 
//二次过滤
$("#doubleNumber").click(function(){
if($(".phones").val().indexOf(",")>=0){
var strAry = $(".phones").val().split(",") ;
}else{
var strAry = $(".phones").val().split("\n");
};
var arr = uniQueue(strAry);
wrong_num(arr)
})


//重号过滤函数 
function uniQueue(array){ 
var arr=[]; 
var m; 
while(array.length>0){ 
m=array[0]; 
arr.push(m); 
array=$.grep(array,function(n,i){ 
return n==m; 
},true); 
} 
$(".phones").val(arr);
$(".phone_num").html("共计号码：<span style='color:red'>"+arr.length+"</span>个");
return arr; 
} 
//错误号码过滤函数
function wrong_num(strAry){
var isMobile=/^(?:13\d|15\d|18\d)\d{5}(\d{3}|\*{3})$/;
var wrong_num=[];
for(var i=0;i<strAry.length;i++){
RegCellPhone = /^([1][0-9]{10})?$/;
falg=strAry[i].search(RegCellPhone);
if (falg==-1){
wrong_num.push(i);
} 
}
for(var j=0;j<wrong_num.length;j++){
strAry.splice(wrong_num[i],1);
}
$(".phones").val(strAry);
$(".phone_num").html("共计号码：<span style='color:red'>"+strAry.length+"</span>个");
}
</script>

转载于:https://www.cnblogs.com/wxw1314/p/5885729.html

weixin_30478619

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
计算输入手机号码数、验证多号码、过滤重复号码

html代码： 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title></title> 5 6 <style type="text/css"> 7 #content #contentmain table tbody tr td { 8 border:0;...
复制链接

扫一扫