Shulou(Shulou.com)06/01 Report--

Editor to share with you jQuery how to achieve a simple login condition judgment, I believe that most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

The details are as follows

First, the effect display

Second, train of thought analysis

1. Change the status of the login button when the input box is not empty and the protocol is checked.

2. You need to enter and modify the check button in the input box to judge.

3. You can encapsulate a function to make the corresponding call.

III. JQuery statement

Encapsulated function (make corresponding code modifications according to your own layout structure)

Function Code () {if (inx = = 0) {if ($(".login-main .focus"). Eq (0) .val ()! =''& & $(".login-main .focus"). Eq (1) .val ()! =''&'& $(".login-main .checkbox"). Prop ("checked")) {$(".login"). Css ({"background":'# ff6900' "cursor": 'pointer'}) Return true;} else {$(".login") .css ({"background":'# ffbe99', "cursor":''}) }} else {if ($(".register-main .focus"). Eq (0). Val ()! ='& & $(".register-main .focus"). Eq (1). Val ()! ='& $(".register-main .checkbox"). Prop ("checked") {$(".register"). Css ({"background":'# ff6900' ") "cursor": 'pointer'}) Return true;} else {$(".register") .css ({"background":'# ffbe99', "cursor":''});}

Called when the input box is typed and when the check state is modified.

/ / 3. Input box effect $(".focus") .on ({focus: function () {$(this) .addClass ("change") .siblings (".meg") .stop () .animate ({top: 8, fontSize: 12}, 200) }, blur: function () {if ($(this). Val ()! = "") {$(this) .removeClass ("change") .siblings (".erron") .stop () .fadeOut } else {$(this) .removeClass ("change") .addClass ("blur") .siblings (".meg"). RemoveClass ("color") .addClass ("becolor"). Stop (). Animate ({top: 20, fontSize: 16 }, 200) .siblings (".erron"). Stop (). FadeIn (200) }, keydown: function () {$(this) .removeClass ("blur") .siblings (".meg"). RemoveClass ("becolor") .addClass ("color") .siblings (".erron"). Stop (). FadeOut (200); Code ();}}); / / 6. Judge login condition $(".checkbox") .change (function () {Code ();}); $(".login") .on ("click", function () {if (Code ()) {alert ("login successful!!");}})) On ("click", function () {if (Code ()) {alert ("registered successfully!");}}); these are all the contents of the article "how to implement simple login criteria for jQuery". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.