Jquery+pdo Write Login Login interface _jquery

jquery is another good JavaScript library after prototype. And it is a lightweight JS library. A total of two versions of JQuery are available for download: One is streamlined and the other is uncompressed (for debugging or reading). These two versions are available for download from jquery.com. Therefore, the development of learning suggests the use of compression.

Of course, in addition to downloading jquery.js files directly, you can also insert a Google or Microsoft CDN in the HTML header to get the library file support directly from the Web when the page is loaded.

Using Google's CDN:

Using the Microsoft CDN:

Copy Code code as follows:

<strong style= "Font-family:verdana, Arial, Helvetica, Sans-serif; line-height:18px; " ></strong>
<p style= "MARGIN-TOP:12PX; margin-bottom:0px; Color:rgb (51, 51, 51); line-height:18px; Font-family:verdana, Arial, Helvetica, Sans-serif; Display:inline!important; Background-color:rgb (249, 249, 249); ></p><pre name= "code" class= "HTML" style= "Color:rgb (51, 51, 51); Font-weight:bold; line-height:24px; Display:inline!important; " ><script type= "Text/javascript" src= "Http://ajax.microsoft.com/ajax/jquery/jquery-1.4.min.js" ></script >

But it is best to download it directly to your project to use it, otherwise there are sometimes network problems and cannot provide support.

Pdo is used to work with databases instead of MySQL or MySQL.

As long as it is removed from the php.ini file; extension=php_pdo. such as the annotated. dll file for PDO. At the same time starting with PHP5, PHP opens the PDO drive by default, so you may not see Php_ in php.ini files Pdo.dll (This is a personal understanding or speculation, the online tutorial said it must need a file, but I just put all the other related to the PDO to comment out, and finally can run. ）

After you remove the annotation and save it, you can run phpinfo to test to see the relevant information about PDO. Indicates that the configuration was successful.

In the last article, Ajax technology has been written with a login login interface, in fact, not so troublesome, you can try jquery and PDO write, feel. So I learned a rough jquery, only to find that only one $post () function can complete the two pages of code I wrote before (of course!). Others are already packaged, just call directly on the line, but I am still very happy to write Ajax directly, which makes me more aware of the asynchronous understanding.

Okay, go straight to the code.

First is the login interface code (and before the difference is not much, there are small changes, but the details of the devil, can be serious to what extent, I will do my best!) ）

Div.css

Div.login
{

border:1px solid #a0b1c4;
height:429px;
width:300px;
Position:absolute;
left:1200px;
top:150px;
 
}

login.php

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">  

Clickme.js

$ (document). Ready (function () {
 $ (#login). Click (function () {
 var user= document.getelementbyid ("user"). value;
 var pwd= document.getelementbyid ("pwd"). Value;
 if (user== "" | | pwd== "")
 {
 alert ("User name and password cannot be empty!")
 Else
 {//emphasis is on this, compared to the amount of code previously written XMLHttpRequest can be seen, in this just call a   //$.post () function
 $.post (
 "/ Login_jquery/php/check.php ",
 $ (" #myform "). Serialize (),
 function (msg) {$ (" #serverResponse "). HTML (msg);}
 ;
  
 
 }
 });
});

<span style= "FONT-SIZE:32PX;" >$.post () function, parameter format is:</span>

<span style= "FONT-SIZE:32PX;" >$.post (Url,data,call, type) </span>

The URL is the address of the requesting page, data is transmitted, callback is the response function, type is the format of the returned content, such as Text/xml. For the purposes of this code, the URL is "/login_jquery/php/check.php" data:$ ("#myform"). Serialize (), where the serialize () function is the serialization of data to be transmitted to facilitate the transfer of data.

Callback:function (msg) {$ ("#serverResponse"). HTML (msg); msg represents the data that the server has returned and then processes it in the function to use HTML () To built-in text values with ID serverresponse.

check.php

<span style= "Font-size:24px;color: #330000;" ><?php

 $mark =0;
 $user =$_request[' user '];
 $pwd =$_request[' pwd '];

 
 $host = ' localhost ';
 $dbname = ' Databaseweb ';
 $DSN = "mysql:host= $host;d bname= $dbname";
 $root = ' root ';
 $mysql _pwd= ' database password ';
 Try
 {
  $pdo = new PDO ($DSN, $root, $mysql _pwd);
 catch (pdoexception $e)
 {
  echo "database connection Failed";
 }
 $row _column= $pdo->query ("select * from user where name= ' $user ' and password= ' $pwd ')";
 
 $row _column is a list (rows) that is returned from the database and cannot be judged by Boolean type.
 //But we can make Boolean judgments by the number of object elements in the list, where the Fetchcolumn () function is used to get the number of row (
 
 $row _column->fetchcolumn () >0)
 {echo matches successfully! ";
 return;
 } 
 else
 {
 echo "user". $user. " does not exist "; 
 return;
 
 
 ></span>

As far as the check.php file is concerned, the PDO is used instead of the mysqli, but this is the tendency to process the database. Learn it!

Right has not been on the image of their own interface, this time to fill up.

Login interface:

Account password is null alert reminder:

The account password and the database are asynchronously matched correctly:

The account password matches the database incorrectly:

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.