登录验证

登录验证的效果图：

(1)布局页面的问题，就是有两个输入框，下面有提示，提示的显示隐藏问题，还有一个按钮

(2)用JQ实现它，显示焦点问题，使用$(this)实现，实现代码的重复使用

(3)失去焦点问题，失去焦点后有三种情况，1、没有输入任何东西2、内容不符合要求3、内容符合要求。。这时候首要的就是$(this).val()获得值，再需要正则表达式的验证，用if()--else if()--else{},确定输出的内容

(4)代码的复用性问题

(5)点击登录按钮，发送ajax请求

布局的图

布局的代码

效果的实现代码

代码的简单封装，去掉重复的代码

公共代码部分

点击登录按钮后，点击，不能马上发送请求，需要判断内容是否不为空，是否前面还有提示。当满足不为空且没有错误提示后，即可发送ajax请求。

点击登录按钮的验证及请求

总结：登录界面考虑的事情是比较多的，对于初次接触，我们可能会考虑得不全面，还有代码重复使用问题，也是需要我们认真思考的一个方面。