今日完成

1.jq学习

jQuery是继prototype之后又一个优秀的Javascript库，是一个由John Resig创建于2006年1月的开源项目。

现在的jQuery团队主要包括核心库、UI和插件等。

jQuery凭借着简洁的语法和跨平台的兼容性，极大地简化了javascript开发人员查找元素、操作DOM、处理事件、执行动画和开发Ajax的操作。

(1)dom

DOM解析HTML页面，将页面元素解释为元素节点、属性节点和文本节点。

而通过DOM解析HTML页面元素，所得到的DOM元素就是DOM对象。

DOM对象可以使用JavaScript中的方法。

2.使用jq验证登录信息,使用jQuery的方法获取dom对象。

页面加载的时候调用中间的函数。

$(document).ready(function () {｝）

根据ID获取Dom对象。

$('#phreg')

<script type="text/javascript">
    $(document).ready(function () {
            $('#phreg').click(function () {
                if ($('#puser').val() == '') {
                    $('#puser').focus().css({
                        border: "1px solid red",
                        boxShadow: "0 0 2px red"
                    });
                    $('#userCue').html("<font color='red'><b>请输入用户名</b></font>");
                    return false;
                }

                if ($('#puser').val().length < 4  || $('#puser').val().length > 10) {

                    $('#puser').focus().css({
                        border: "1px solid red",
                        boxShadow: "0 0 2px red"
                    });
                    $('#userCue').html("<font color='red'><b>用户名位4-10字符</b></font>");
                    return false;
                }
                if($('#phpasswd').val().length < 6){
                    $('#phassword').focus();
                    $('#userCue').html("<font color='red'><b>密码不能小于6位</b></font>");
                    return false;
                }
                if($('#phpasswd').val() != $('#phpasswd2').val()){
                    $('#passwd2').focus();
                    $('#userCue').html("<font color='red'><b>两次密码不一致</b></font>");
                    return false;
                }
                if($('#phoneCode').val()==''){
                    $('#phoneCode').focus();
                    $('#userCue').html("<font color='red'><b>请获取验证码</b></font>");
                    return false;
                }

            })
        }
    )

.val()得到对象的值。

.click（）点击事件。

3.试一下页面的效果。

4.手机号码匹配的，调用点击事件，匹配正则。校验手机号码之后使用ajax调用异步请求。通过返回值渲染页面。

<%--手机验证码生成，校验--%>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#phqyzm').click(function () {
                var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(17[0]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-9]{1}))+\d{8})$/;
                if($('#phoneNum').val() == ''){

                    $('#phoneNum').focus();
                    $('#userCue').html("<font color='red'><b>请输入手机号</b></font>");
                }
                if(!myreg.test($('#phoneNum').val()) || $('#phoneNum').val().length < 11 ){
                    $('#phoneNum').focus();
                    $('#userCue').html("<font color='red'><b>格式不对哦</b></font>");
                }else {
                        $.post("/ajax1",{phoneNum:$('#phoneNum').val()},function (data,status) {

                            console.log(data);
                            console.log(status);

                        });


                    alert("xxx")
                }

明日计划

1.完成任务7.

2.小课堂

收获

1.Jquery和ajax真的好用。