php ajax用户登陆验证程序代码
核心代码如下:
<script type= "text/javascript" > $(document).ready( function () { $( "#login" ).click( function () { var action = $( "#form1" ).attr( 'action' ); var form_data = { username: $( "#username" ).val(), password: $( "#password" ).val(), is_ajax: 1 }; $.ajax({ type: "POST" , url: action, data: form_data, success: function (response) { if (response == 'success' ) $( "#form1" ).slideUp( 'slow' , function () { $( "#message" ).html( "<p class='success'>登陆成功!</p>" ); }); else $( "#message" ).html( "<p class='error'>用户名或密码错误.</p>" ); } }); return false; }); }); </script>index.php源码, 代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://HdhCmsTestw3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" > <html xmlns= "http://HdhCmsTestw3.org/1999/xhtml" > <head> <meta http-equiv= "Content-Type" content= "text/html; charset=utf-8" /> <title>PHP Login with jQuery AJAX</title> <style> body, input { font-family: Georgia, "Times New Roman" , Times, serif; } #content { background-color: #eee; width: 300px; margin: 0 auto; border: 1px solid #aaa; -moz-border-radius: 10px; -moz-box-shadow: 0 0 10px #aaa; -webkit-border-radius: 10px; -webkit-box-shadow: 0 0 10px #aaa; padding: 10px; } #form1 label { display: block; font-size: 16px; line-height: 25px; } #form1 input[type=text], #form1 input[type=password] { padding: 2px; font-size: 16px; line-height: 20px; width: 250px; } #form1 input[type=submit] { font-size: 20px; font-weight: bold; padding: 5px; } .success { color: #060; } .error { color: red; } </style> <script type= "text/javascript" src= "jquery-1.5.2.min.js" ></script> <script type= "text/javascript" > $(document).ready( function () { $( "#login" ).click( function () { var action = $( "#form1" ).attr( 'action' ); var form_data = { username: $( "#username" ).val(), password: $( "#password" ).val(), is_ajax: 1 }; $.ajax({ type: "POST" , url: action, data: form_data, success: function (response) { if (response == 'success' ) $( "#form1" ).slideUp( 'slow' , function () { $( "#message" ).html( "<p class='success'>You have logged in successfully!</p>" ); }); else $( "#message" ).html( "<p class='error'>Invalid username and/or password.</p>" ); } }); return false; }); }); </script> </head> <body> <p> </p> <div id= "content" > <h1>Login Form</h1> <form id= "form1" name= "form1" action= "doLogin.php" method= "post" > <p> <label for = "username" >Username: </label> <input type= "text" name= "username" id= "username" /> </p> <p> <label for = "password" >Password: </label> <input type= "password" name= "password" id= "password" /> </p> <p> <input type= "submit" id= "login" name= "login" /> </p> </form> <div id= "message" ></div> </div> </body> </html>
loin.php代码如下:
<?php $is_ajax = $_REQUEST [ 'is_ajax' ]; if (isset( $is_ajax ) && $is_ajax ) { $username = $_REQUEST [ 'username' ]; $password = $_REQUEST [ 'password' ]; if ( $username == 'demo' && $password == 'demo' ) { echo "success" ; } } ?>查看更多关于php ajax用户登陆验证程序代码 - 综合实例的详细内容...
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did3809