See a little plugin today.
How the TP framework implements the verification code.
It's time for us to be the same, first of all, to do a display of the HTML interface named: zhuce.html
<!DOCTYPE HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "><HTMLxmlns= "http://www.w3.org/1999/xhtml"><Head><Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8" /><title>Untitled Document</title><Scriptsrc= "__public__/js/jquery-1.11.2.min.js"></Script></Head><Body><!--Form Form POST method pass value -<formAction= "__action__"Method= "POST"><!--text Box -<inputtype= "text"name= "Yzm" /><!--Verification Code Picture -<imgsrc= "__controller__/yzm"ID= "img" /><Div><inputtype= "Submit"value= "Verify" /></Div></form></Body></HTML>
Next we have to go backstage to write the code, is not very look forward to?
Where to submit, where to verify
<?phpnamespace Home\controller; UseThink\controller;classTestControllerextendscontroller{//Verification Code Public functionzhuce () {if(Empty($_post)) { $this-Show (); } Else { $verify=New\think\verify (); Var_dump($verify->check ($_post["Yzm"]);//The first parameter inside the check method is the string entered by the user, and the second parameter is $id, which identifies it. This place can use the Var_dump () method to output a test verification code is entered correctly } } Public functionYzm () {$Verify=New\think\verify (); $Verify->fontsize = 20;//Font Size $Verify->length = 3;//displays the number of characters $Verify->fontttf = "5.ttf";//define font//$Verify->USEIMGBG = true; Define a background map $Verify->usezh =true;//Enable Chinese verification code (Chinese font file must be introduced) $Verify->fontttf = "Simhei.ttf";//the type of Chinese font displayed $Verify-entry (); }}
Here you can use different methods to set different styles for the picture.
You can now display the verification code:
Let's do it again. Click on the image to toggle the verification code, just use the simple jquery.
Zhuce.html all the code on the page:
<!DOCTYPE HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "><HTMLxmlns= "http://www.w3.org/1999/xhtml"><Head><Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8" /><title>Untitled Document</title><Scriptsrc= "__public__/js/jquery-1.11.2.min.js"></Script></Head><Body><!--Form Form POST method pass value -<formAction= "__action__"Method= "POST"><!--text Box -<inputtype= "text"name= "Yzm" /><!--Verification Code Picture -<imgsrc= "__controller__/yzm"ID= "img" /><Div><inputtype= "Submit"value= "Verify" /></Div></form></Body></HTML><Script>$ (document). Ready (function(e) {$ ("#img"). Click (function(){ //because of the compatibility of the browser, so create a random number here, with a random number to achieve the click image Switch. vara=Math.ceil (Math.random ()* -); //pass a random number parameter, and no substance, just to allow the browser to achieve a click Switch $( This). attr ("src","__controller__/yzm/a/"+a+""); })});</Script>
Be sure to note the compatibility issue here. Some browsers are not supported if you redefine SRC directly, so we use random numbers to implement them.
Over. It's not hard. ^_^
TP Framework Implementation Verification Code
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
