js验证手机号

<%@ page language="java" contentType="text/html; charset=UTF-8"

    pageEncoding="UTF-8"%>

<%

    String path = request.getContextPath();

    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<base href="<%=basePath%>">

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<script type="text/javascript" src="static/js/jquery-1.7.2.js"></script>

<title>绑定手机号</title>

</head>

<body>

    <form action="onlineUser/updatephone" method="post" onsubmit="return checkAll()">

        <input type="hidden" value="${userid }" name="id">

        手机号

        <input type="text" name="phonenumber" id="phonenumber"><br>

        验证码：<input type="text" name="vercode" id="vercode"> <input type="button" value="发送验证码" id="sendVercode"><br>

        <textarea rows="6" cols="4" id="validateCodeError" style="display: none;"></textarea>

        <input type="hidden" id="realvercode">

        <input type="submit" value="绑定">

    </form>

</body>

<script type="text/javascript">

function checkAll(){

    if(!$("#phonenumber").val().trim()){

        alert("请填写手机号");

        return false;

    }

    if(!$("#realvercode").val().trim()){

        alert("请填写验证码");

        return false;

    }

    if(!$("#vercode").val().trim()){

        alert("请填写验证码");

        return false;

    }

    return true;

}

$(function(){

    // 发送手机验证码

    $('#sendVercode').click(function() {

        var phoneNum = $('#phonenumber').val().trim(); // 获得发送手机的号码

        // 判断手机号码格式是否正确

        var mobile = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/;

                    var re = mobile.test(phoneNum);

                    if(re == false){

                        $('#validateCodeError').removeAttr('style');

                        $('#validateCodeError').empty();

                        $('#validateCodeError').html('请输入正确格式的手机号码');

                        return ;

                    }

        var flag = true ;

            if (phoneNum) {

                $.post('onlineUser/sendSMS', {

                            'phone' : phoneNum

                        },function(data){

                            if(data.status){

                                if(flag){

                                    alert(data.message);

                                    flag = false ;

                                }

                                $("#realvercode").val(data.data);

                                $('#validateCodeError').attr('style','display:none;');

                            }else{

                                console.log(data.message);

                                $('#validateCodeError').removeAttr('style');

                                $('#validateCodeError').empty();

                                $('#validateCodeError').html(data.message);

                            }

                        }, 'json');

            }else{

                console.log('未输入手机号码');

                $('#validateCodeError').removeAttr('style');

                $('#validateCodeError').empty();

                $('#validateCodeError').html('请输入手机号码');

            }

        });

});

</script>

</html>
相关文章
