弹出层

$("#registerInLogin").live('click',
function() {
    Header.register();
});
var Header = {
    register: function() {
        // $.post(path + '/web/headerregister.jsp', {}, function(str){
        // layer.open({
        // type: 1,
        // title: false,
        // closeBtn: 0,
        // shadeClose: true,
        // area: ['815px', '372px'],
        // skin: 'yourclass',
        // content: str
        // });
        // });
        var str = Header.getRegisterHtml();

        layer.open({
            type: 1,
            title: false,
            closeBtn: 0,
            shadeClose: true,
            area: ['815px', '372px'],
            skin: 'yourclass',
            content: str
        });

        $("#hpassword-propmt").focus(function() {
            $(this).hide();
            $("#huserPassword").show().focus();
        });

        $("#huserPassword").blur(function() {
            if ($("#huserPassword").val() == "") {
                $("#huserPassword").hide();
                $("#hpassword-propmt").show();
            }
        });
    },
    login: function() {
        // $.post(path + '/web/headerlogin.jsp', {}, function(str){
        // layer.open({
        // type: 1,
        // title: false,
        // closeBtn: 0,
        // shadeClose: true,
        // area: ['815px', '372px'],
        // skin: 'yourclass',
        // content: str
        // });
        // });
        var str = Header.getLoginHtml();
        layer.open({
            type: 1,
            title: false,
            closeBtn: 0,
            shadeClose: true,
            area: ['815px', '372px'],
            skin: 'yourclass',
            content: str
        });

        $("#hpassword-propmt").focus(function() {
            $(this).hide();
            $("#loginUserPassword").show().focus();
        });

        $("#loginUserPassword").blur(function() {
            if ($("#loginUserPassword").val() == "") {
                $("#loginUserPassword").hide();
                $("#hpassword-propmt").show();
            }
        });
    },
    getLoginHtml: function() {
        var strHtml = '';
        strHtml += '<div class="hlogin-box">';
        strHtml += '<div class="hlogin-right left">';
        strHtml += '<div class="hlogin-right-d">';
        strHtml += '<span class="hlogin-right-msg">还没有开通账户?</span>';
        strHtml += '<a class="hlogin-top-btn" id="registerInLogin">注册</a>';
        strHtml += '</div>';
        strHtml += '<div class="hlogin-right-d-body">';
        strHtml += '<div>';
        strHtml += '<div class="left">';
        strHtml += '<img src="./imgs/icon_username.png" class="hlogin_icon"/>';
        strHtml += '</div>';
        strHtml += '<div class="left">';
        strHtml += '<input class="hlogin-item-input" maxlength="11" id="loginMobilePhone" type="text" ';
        strHtml += 'onfocus="if(this.value==\'请输入手机号码\') this.value=\'\';this.style.color=\'#000\'" ';
        strHtml += 'onblur="if(this.value==\'\'){ this.value=\'请输入手机号码\';this.style.color=\'#999\'}" ';
        strHtml += 'style="color: #999999;" ';
        strHtml += 'value="请输入手机号码" name="clUserInfo.mobilePhone"/>';
        strHtml += '</div>';
        strHtml += '</div>';
        strHtml += '<div class="hlogin-item2">';
        strHtml += '<div class="left">';
        strHtml += '<img src="./imgs/icon_password.png" class="hlogin_icon"/>';
        strHtml += '</div>';
        strHtml += '<div class="left">';
        strHtml += '<input class="hlogin-item-input" maxlength="32" type="password" id="loginUserPassword" name="clUserInfo.userPassword" style="display:none;"/>';
        strHtml += '<input type="text" id="hpassword-propmt" value="请输入密码" style="color: #999999;" class="hlogin-item-input" />';
        strHtml += '</div>';
        strHtml += '</div>';
        strHtml += '<div class="hlogin-item3">';
        strHtml += '<div class="hlogin-item3-right right">';
        strHtml += '<a class="hlogin-item3-right-a" href="' + path + '/web/getrepassword.do">密码找回</a>';
        strHtml += '</div>';
        strHtml += '</div>';
        strHtml += '<div class="hlogin-btn">';
        strHtml += '<input class="hlogin-btn-login" type="button" onclick="HeaderLogin.loginSubmit();" value="登录"/>';
        strHtml += '</div>';
        strHtml += '</div>';
        strHtml += '</div>';
        strHtml += '<div class="hlogin-left right">';
        strHtml += '<div class="hlogin-left-ibox"></div>';
        strHtml += '</div>';
        strHtml += '<div class="clear"></div>';
        strHtml += '</div>';

        return strHtml;
    },
    getRegisterHtml: function() {
        var strHtml = '';
        strHtml += '<div class="hregister-box">';
        strHtml += '<div class="hlogin-right left">';
        strHtml += '<div class="hlogin-right-d">';
        strHtml += '<span class="hlogin-right-msg">已经开通账户?</span>';
        strHtml += '<a class="hlogin-top-btn" href="' + path + '/web/login.jsp">登录</a>';
        strHtml += '</div>';
        strHtml += '<form action="' + path + '/web/register.do" method="post" onsubmit="return HeaderRegister.registerSubmit();">';
        strHtml += '<div class="hlogin-right-d-body">';
        strHtml += '<div>';
        strHtml += '<div class="left hlogin-icon-username">';
        strHtml += '</div>';
        strHtml += '<div class="left">';
        strHtml += '<input class="hlogin-item-input" maxlength="11" value="请输入手机号码" type="text" ';
        strHtml += 'onfocus="if(this.value==\'请输入手机号码\') this.value=\'\';this.style.color=\'#000\'" ';
        strHtml += 'onblur="if(this.value==\'\'){ this.value=\'请输入手机号码\';this.style.color=\'#999\'}" ';
        strHtml += 'style="color: #999999;" ';
        strHtml += 'name="clUserInfo.mobilePhone" id="hphoneNo"/>';
        strHtml += '</div>';
        strHtml += '</div>';

        strHtml += '<div class="hlogin-item2">';
        strHtml += '<div class="left hlogin-icon-randno">';
        strHtml += '</div>';
        strHtml += '<div class="left">';
        strHtml += '<input class="hlogin-item4-input" maxlength="6" type="text" ';
        strHtml += 'onfocus="if(this.value==\'请输入验证码\') this.value=\'\';this.style.color=\'#000\'" ';
        strHtml += 'onblur="if(this.value==\'\'){ this.value=\'请输入验证码\';this.style.color=\'#999\'}" ';
        strHtml += 'style="color: #999999;" ';
        strHtml += 'value="请输入验证码" ';
        strHtml += 'name="randomNo" id="hrandomNo"/>';
        strHtml += '</div>';
        strHtml += '<div class="left">';
        strHtml += '<span class="hlogin-item4-btn" onclick="HeaderRegister.sendMessage();" >获取验证码</span>';
        strHtml += '<input type="button" class="hlogin-item4-time" value="获取中(100S)"/>';
        strHtml += '</div>';
        strHtml += '</div>';

        strHtml += '<div class="hlogin-item2">';
        strHtml += '<div class="left hlogin-icon-password">';
        strHtml += '</div>';
        strHtml += '<div class="left">';
        strHtml += '<input class="hlogin-item-input" maxlength="32" type="password" name="clUserInfo.userPassword" id="huserPassword" style="display:none;"/>';
        strHtml += '<input type="text" id="hpassword-propmt" value="请输入密码" style="color: #999999;" class="hlogin-item-input" />';
        strHtml += '</div>';
        strHtml += '</div>';
        strHtml += '<div class="hregister-btn">';
        strHtml += '<input class="hlogin-btn-login" type="submit" value="注册"/>';
        strHtml += '</div>';
        strHtml += '</div>';
        strHtml += '</form>';
        strHtml += '</div>';
        strHtml += '<div class="hlogin-left right">';
        strHtml += '<div class="hlogin-left-ibox"></div>';
        strHtml += '</div>';
        strHtml += '<div class="clear"></div>';
        strHtml += '</div>';

        return strHtml;
    }
};

var HeaderLogin = {
    loginSubmit: function() {
        var mobilePhone = $("#loginMobilePhone").val();
        if (!HeaderLogin.isMobile(mobilePhone)) {
            alert("请输入正确的手机号!");
            $("#loginMobilePhone").focus();
            return;
        }

        var userPassword = $("#loginUserPassword").val();
        if (userPassword == null || userPassword == "") {
            alert("请输入密码!");
            $("#loginUserPassword").focus();
            return;
        }

        var parameter = {};
        parameter["clUserInfo.mobilePhone"] = mobilePhone;
        parameter["clUserInfo.userPassword"] = userPassword;

        var _url = path + "/web/ajaxLogin.do";
        $.ajax({
            url: _url,
            type: "post",
            dataType: "json",
            data: parameter,
            beforeSend: function() {

},
            success: function(data) {
                if (data.error_code == 0) {
                    window.location.reload();
                } else if (data.error_code == 103) {
                    alert("请输入手机号和密码!");
                } else if (data.error_code == 20103) {
                    alert("手机号或密码错误,请重新输入!");
                } else if (data.error_code == 20001) {
                    alert("手机号或密码错误,请重新输入!");
                } else {
                    alert(errMap.get(data.error_code));
                }
            },
            error: function() {

}
        });
    },
    isMobile: function(value) {
        var length = value.length;
        var mobile = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/;
        return length == 11 && mobile.test(value);
    }
};

var HeaderRegister = {
    timerCount: 100,
    obj: null,
    timer: function() {
        $(".hlogin-item4-btn").hide();
        $(".hlogin-item4-time").show().val("获取中(100S)");
        HeaderRegister.timerCount = 100;
        HeaderRegister.obj = setInterval(function() {
            HeaderRegister.timerCount--;
            if (HeaderRegister.timerCount == 0) {
                clearInterval(HeaderRegister.obj);
                $(".hlogin-item4-time").hide();
                $(".hlogin-item4-btn").show();
            } else {
                $(".hlogin-item4-time").val("获取中(" + HeaderRegister.timerCount + "S)");
            }
        },
        1000);
    },
    flag: false,
    sendMessage: function() {
        var phoneNo = $("#hphoneNo").val();

        if (!HeaderRegister.isMobile(phoneNo)) {
            alert("请输入正确的手机号!");
            jQuery("#hphoneNo").focus();
            return;
        }

        var _url = path + "/web/sendMessage.do";
        var parameter = {};
        parameter["clUserInfo.mobilePhone"] = phoneNo;
        $.ajax({
            url: _url,
            type: "post",
            dataType: "json",
            data: parameter,
            beforeSend: function() {},
            success: function(data) {
                if (data.error_code == 0) {
                    HeaderRegister.timer();
                    HeaderRegister.flag = true;
                } else if (data.error_code == 20101) {
                    alert("该手机号已经注册!");
                    HeaderRegister.flag = false;
                } else if (data.error_code == 81111) {
                    alert("短信发送失败!");
                    HeaderRegister.flag = false;
                } else {
                    alert(errMap.get(data.error_code));
                    HeaderRegister.flag = false;
                }
            },
            error: function() {

}
        });
    },
    //校验短信验证码
    messageValidate: function() {

},
    registerSubmit: function() {
        var phoneNo = $("#hphoneNo").val();

        if (!HeaderRegister.isMobile(phoneNo)) {
            alert("请输入正确的手机号!");
            jQuery("#hphoneNo").focus();
            return false;
        }

        var randomNo = jQuery("#hrandomNo").val();
        if (randomNo == null || randomNo == "" || isNaN(randomNo)) {
            alert("请输入正确的验证码!");
            jQuery("#hrandomNo").focus();
            return false;
        }

        var userPassword = jQuery("#huserPassword").val();
        if (userPassword == null || userPassword == "") {
            alert("请输入密码!");
            jQuery("#huserPassword").focus();
            return false;
        }

        if (!HeaderRegister.flag) {
            alert("请先获取验证码!");
            return false;

        }
        return true;

    },
    isMobile: function(value) {
        var length = value.length;
        var mobile = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/;
        return length == 11 && mobile.test(value);
    }
};

 

posted @ 2018-04-06 21:00  程序员小明1024  阅读(284)  评论(0编辑  收藏  举报