jQuery+Ajax+PHP登录实例 一个简单的用Jquery中ajax方法登录的例子

 

HTML代码(login.html)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript" src="login.js"></script> 
<style type="text/css"> 
   body { font:12px/1.6em "宋体" } 
   ul { list-style:none; } 
   li { margin-top:10px; } 
</style> 
</HEAD>

<BODY>
<h3>会员登录</h3> 
<div id="login"> 
<form method="post" action="login.php" id="form" name="form"> 
    <ul> 
      <li>名字:<input type="text" name="user" id="user" size="16" maxlength="20"></li> 
      <li>密码:<input type="password" name="pass" id="pass" size="16" maxlength="20"></li> 
      <li> 
        <input type="submit" style="border:0" /> 
      </li> 
      <li id="confirm"></li> 
    </ul> 
</form> 
</div>
</BODY>
</HTML>

JS代码(login.js)

$(document).ready(function(){ 
    $("#form").submit(function(){ 
        login(); 
        return false; 
    }); 
}); 
function login() { 
var user = $("#user").val(); 
var pass = $("#pass").val(); 
if (user == "") { 
    $("#confirm").text("请输入登录用户名"); 
    $("user").focus(); 
    return false; 

if(pass == "") { 
    $("#confirm").text("请输入登录密码"); 
    $("#pass").focus(); 
    return false; 

$.ajax({ 
    type: "POST", 
    url: "login.php", 
    data: "id=" + user + "&p=" + pass, 
    beforeSend: function(){ 
    $("confirm").text("登录中,请稍候"); 
    }, 
    success: function(msg){ 
    if(msg == "success"){ 
        $("#confirm").text("登录成功,欢迎" + user + "回来!正在进入你的空间"); 
    }else { 
        $("#confirm").text("没有此用户或者密码不正确!"); 
    } 
    } 
}); 
}

PHP代码(login.php)

<?php 
$p = isset($_POST["p"]) ? $_POST["p"] : $_GET["p"]; 
$id = isset($_POST["id"]) ? $_POST["id"] : $_GET["id"]; 
if($id == "admin" && $p == "admin"){ 
    echo ‘success‘; 

?>

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。