一个登录 的例子

一个登录的例子

jq，

验证码自动刷新

点击图片验证码刷新

判断localStorage

默认回车登录

添加交互样式

<div class="img-captcha-wrap" onselectstart="return false;" style="-moz-user-select:none;">     <img src="json/code.jsp" onclick="this.src='json/code.jsp?rand=' + Math.random();$('#captcha').val('');"></div> 

    $(function(){    //加载时自动刷新    function refesh(){    $('.codeImg img').attr('src', 'json/code.jsp?rand=' + Math.random());    };    refesh();        var user= localStorage.getItem(username);    if(user){    $('#remberUsername').attr('checked',true);//checkbox    $("#username").val(user);        }    //    var empty = function(obj,msg){    if(!obj){    // 用户名不能为空    parent.layer.msg(msg,{time:1500});    return false;    };    return true;    }    //默认回车登录    $("body").bind('keyup',function(event) {          if(event.keyCode==13){          $("#signIn").click();//trigger() 方法触发被选元素上指定的事件以及事件的默认行为         }         });             $("#signIn").click(function(){     var signIn={     username:$("#username").val(),     md5password:$("#md5password").val(),     code: $('#captcha').val()      };        if(!empty(signIn.username,"用户名不能为空")){    return;    }        if(!empty(signIn.md5password,"密码不能为空")){        return;        };        if(!empty(signIn.code,"图形验证码不能为空")){        return;        };             $(this).attr('disabled',true);//失效                    $("body").off('keydown');     var parameter = signIn;     parameter.GID ="partner.logon";     $.ajax({        type : 'POST',        url : sWebRootPath + "/WebService",        dataType : 'json',        data : JSON.stringify(parameter),        success : function(data){                // console.log(data);        if (data.issuccess) {        //登录表单右侧移动消失        $(".lonon-content").addClass("bounceOutRight");        //弹出成功信息        parent.layer.msg("登录成功",{time:900});        //跳转index页面        setTimeout(function(){        location.href=sWebRootPath;        }, 1500);        } else {        //弹出错误信息        // console.log(data);        parent.layer.msg(data.rtnmessage,{time:1500});        refesh();        }        },        error: function(data){        //弹出错误信息        // console.log(data);//{readyState: 4, responseText: "图形验证码不正确", status: 200, statusText: "OK"}    parent.layer.msg(data.responseText,{time:1500});    $(this).attr('disabled',false);        }        });                 });          //添加样式交互        $(".formInput input").focusin(function(){        var $this = $(this);        $this.parents(".formList").addClass("formListActive");            $(document).keyup(function(){    if($this.val()!=""){    $this.parents(".formList").find(".km-icon").show();    }else{    $this.parents(".formList").find(".km-icon").hide();    }    })    });                $(".km-icon-del").click(function(){        $(this).parents(".formList").find("input").val("");        $(this).hide();        });    $(".formInput input").focusout(function(){    $(this).parents(".formList").removeClass("formListActive")    })                    });