jquery ajax Post Get 登錄驗證例子
編輯：AJAX詳解
$.get(url, params, callback)
用GET方式請求載入遠程頁面實例
返回值：XMLHttpRequest
參數：
- url (String): 裝入頁面的URL地址。
- params (Map): （可選）發送到服務端的鍵／值對參數。
- callback (Function): （可選） 當遠程
頁面裝入完成時執行的函數.
- 如果您需要帶參數只需要
$.get(“get.Html”,{參數名稱1:”參數1值”,參數名稱2:”參數2值”},function(data){
$(“#show”).Html(data);
})$.post(url, params, callback)
用HTTP POST方式裝入一個遠程頁面
返回值：XMLHttpRequest
參數：
- url (String): 裝入頁面的URL地址。
- params (Map): （可選）發送到服務端的鍵／值對參數。
- callback (Function): （可選）
當數據裝入完成時執行的函數
Login登錄前端代碼
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Login.ASPx.cs"
Inherits="Login" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
XMLns="http://www.w3.org/1999/xHtml" >
<head runat="server">
<title>Login Page</title>
<script src="jQuery.JS"
type="text/javascript"></script>
<script language="Javascript" type="text/Javascript">
$(document).ready(function(){
$("#btnLogin").click(function()
{
Login();
});
});
function Login(){
if(Check())
{
LoginSuccess();
}
}
function Check(){
if
($("#txtUser").val()=="")
{
alert("The user isn't empty");
$("#txtUser").focus();
return false;
}
if
($("#txtPassword").val()=="")
{
alert("The Password isn't empty")
$("#txtPassWord").focus();
return false;
}
return
true;
}
function LoginSuccess(){
$.AJax({
type:"POST",
url:"CheckLogin.ASPx",
data:{userName:$("#txtUser").val
(),userPwd:$("#txtPassWord").val()},
beforeSend:function(){$("#msg").Html("logining
");},
success:function(data){
$("#msg").html(decodeURI(data));
}
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div style="margin-left:32px;">
<a>User:</a><input id="txtUser" type="text" />
</div>
<div>
<a>Password:</a><input id="txtPassWord"
type="text" />
</div>
<div id="msg"></div>
<div>
<input id="btnLogin" type="button" value="Login"
/></div>
</form>
</body>
</html>
checkLogin服務端代碼
using System;
using System.Data;
using
System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using
System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class checkLogin :
System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
string retVal = "";
string userName = Request["userName"];
string userPwd = Request["userPwd"];
if (userName == "ike"
&& userPwd == "123")
{
retVal = "Login is success";
}
else
{
retVal = "Login is false";
}
Response.Write(retVal);
}
}
}
小編推薦
熱門推薦