Ajax的几种形式 和使用情况

Ajax的几种形式：

1       $.get(

"Login.ashx",

{Name:name,Pwd:pwd,action:x},

function(data){这里用data的返回值进行if判断}

)

2  $.ajax({

type:"post",

url：“Register.ashx”,

data:”Name=”+name+”&&Pwd=”+pwd+”&&action=1”,

//data:{name:name,pwd:pwd,action:2},

Success:function(data){

if (data == "1") {

alert("注Á¡é册¨¢成¨¦功|");

window.location.href = "GetTime.htm";

}

else {

alert("注Á¡é册¨¢失º¡ì败㨹");

}

}

})

   3  $.getJSON(

"GetJson.ashx",

{ name: $("#uname").val(), action: 2 },

function (data) {

$("#result tbody").empty();

$.each(data, function (index, item) {

$("#result tbody").append("<tr><td>" + item.ID + "</td><td>" + item.UserName + "</td><td>" + item.Pwd + "</td></tr>");

//        $("#result tbody").append("<tr><td>" + item.ID + "</td><td>" + item.UserName + "</td><td>" + item.Pwd + "</td><td><a href='Del.aspx?id="+id+">删¦?除y</a></td><td><a href='Update.aspx?id="+id+"'>修T改?</a></td></tr>");

});

$("#result").show();

});

 

----------------------------------------------------------------------------------------------------------------

注册：

用户名(id=name)，密码(id=pwd)，确认密码(id=confirpwd)，提交(id=btn)

$(function(){

//就是一个注册事件

$("#btn").click(function(){

//点击btn要判断是不是为空，

var Na=$("#name").val();

var Pw=$("#pwd").val();

var ConPwd=$("#confirpwd").val();

//给一个为空的提示

var err="";

if(Na=="")

{err=err+"用户名不能为空";}

if(Pw=="")

{ere+="密码不能为空";}

if(ConPwd=="")

{err+="确认密码不能为空";}

if(Pw!=ConPwd)

{ err+="俩次密码不一致"; }

if(err!="")

{ Alert(err); return;    }

$.ajax({

type:"get",

url:"Hello world.ashx",

data="name="+name+"&pwd="+pwd,

success: function(data){

if(data=="1")

{

alert("注册成功");

window.location.href = "GetTime.htm";

}

else

{

alert(注册失败);

}

}

})

});

});

Ajax=异步JavaScript和xml；

Ajax是通过在后台与服务器进行少量的数据交换，ajax可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

报文指的就是一串数据，就是要传送的的东西

在不同的浏览器中创建对象的方式不同

在IE5/6为 ：

var xmlRequest = new ActiveXObject(“Microsoft.XMLHTTP”);

在IE、Firefox、safari和Opera中创建该对象的JavaScript代码为：

var xhr = new XMLHttpRequest();

Ajax在本质上是浏览器端的技术，

Ajax的核心就是创建XMLHttpRequest对象

1. XMLHttpRequest xhr=new XmlHttpRequest(); 创建对象(new 叫助手过来)

2.  xhr.Open("post","Hello world.html",ture);创建请求(open 告诉他要做的事)

3.  xhr.send("name="+name.value);发送请求(send 去吧)，附带传参数

异步使用XMLHttpRequest对象时，必须使用onreadyStatechange事件

　１．创建一个对象

　２．设置onreadyStatechange事件，触发一个回调函数

xhr.onreadyStatechange=watching;

function watching(){}

xhr.onreadyStatechange=function(){

if(xhr.readyState==4)请求状态

{

if(xhr.Status==200)服务器返回的状态码

{

var span=document.getelementById("ename");

span.innerHtml=xhr.responseText;

}

}

}

----查询ID，展现出账号密码

用户名：<input type="text" id="uid">

<input type="botton" id="btn" value="查询">

<table id="result">

<tr><td>ID</td><td>用户名</td><td>密码</td></tr>

</table>

<script>

$(function(){

$("#Btn").clicl(function(){

var id=$("#uid").val();

if(id=="")

{

return ;

}

$.getJSON(

"GetJson.ashx",

{ID:id},

function(data){

$("#result tbody").append("<tr><td>"+data.ID+"</td><td>"+data.UserName+"</td><td>"+data.UserName

+"</td></tr>");

$("#result").show();

})

})

})

</script>

||||||||||||||||

int id=Convert.ToInt32(context.Request["ID"]);//接受前台的传值过来

UserBll userbll=new UserBll();

UsersModel user=new UsersModel();

user=userbll.GetModel(id);

string s="{ID:"+user.ID+",name:"+userName.UserName+",pwd:"+user.Pwd+"}";

//JavaScriptSerializer js = new JavaScriptSerializer();

// string s = js.Serialize(user);

context.Response.write(s);

-----------------------------------------------------------------------------------------

获取时间

<input type="button" id="GetTime" values="获取时间"/>

<div id="ShowTime"></div>

<script>

window.onload=function(){

var BtnTime=document.getElementById("#GetTime");

BtnTime.onclick=function(){

var showTime=document.GetElementById("ShowTime");

var xhr;

xhr=new XMLHttpRequest();

xhr.open("get","Gettime.ashx?name="+"2b",ture),

xhr.send();

xhr.onreadystatechange=function(){

if(xhr.readyState==4)

{

if(xhr.status==200)

{

showTime.innerHTML=xhr.responseText;

}

}

}

}

}

<script>

||||||||||||||||||||

string name=context.Request["name"];

context.Response.write(name+"你好，现在时间是"+DateTime.Now.ToString());

-------------------------------------------------------------------------------

<script>

window.onload=function(){

var uname=document.GetElementById("uname");

uname.onblur=function(){

if(uname.value=="")

{

return;

}

else

{

var xhr=new XMLHttpRequest();

xhr.open("post","Regiater.ashx",ture),

xhr.send("name="+uname.value+"&action=1");

xhr.onreadystatechange=function(){

if(xhr.readyState==4)

{

if(xhr.status==200)

{

var span=document.getElementById("ename");

span.innerHTML=xhr.responseText:+"日期"+xhr.getRequestHeader("date");

span.innerHTML=xhr.responseText;

}

}

}

}

}

}

---------------------------------------------------------------------

$(function(){

$("btnReg").click(function(){

var name=$("uname").val();

var pwd=$("upwd").val();

var repwd=$("#repwd").val();

var span=$("#ename").val();

var err="";

if (span != "") {

err = err + "用户名已存在";

}

if (name == "") {

err += "用户名不能为空！\n";

}

if (pwd == "") {

err += "密码不能为空\n";

}

if (repwd == "") {

err += " 确认密码不能为空\n";

}

if (pwd != repwd) {

err += "俩次密码不一样\n";

}

if (err != "") {

alert(err);

return;

}

$.ajax({})

$.ajax({

type:"post",

url:"Regiter.ashx",

data:"name="+name+"&pwd="+pwd+"&action=2",

//data:{name:name,pwd:pwd,action:2},

success:function(data){

if(data=="1")

{

alter("注册成功");

window.location.href="GetTime.html";

}

else

{

alert("注册失败");

}

}

})

})

})

<script>

<table>

<tr><td>用户名：</td><td><input type="text" id="uname"><span id="ename"></span></td></tr>

<tr><td>密码：</td><td><input type="password" id="upwd" /></td></tr>

<tr><td>确认密码:</td><td><input type="password" id="repwd" /></td></tr>

<tr><td></td><td><input type="button" value="注册" id="btnReg" /></td></tr>

</table>

|||||||||||||||||||||||||||||||

UsersBll userbll = new UsersBll();

//context.Response.Write("Hello World");

#region

string uname = context.Request["name"];//接受data里的name；

string pwd = context.Request["pwd"];

string action=context.Request["action"];

if (action == "1")//验证用户名是否存在

{

bool tag = userbll.Exist(uname);//bll里都是方法

if (tag)

{

context.Response.Write("用户名存在");

}

else

{

context.Response.Write("");

}

}

else if (action == "2")//注册用户，执行注册代码

{

UsersModel user = new UsersModel();

user.UserName = uname;

user.Pwd = pwd;

int result = userbll.Add(user);

if (result > 0)

{

context.Response.Write(1);//去前台

}

else

{

context.Response.Write("注册失败");

}

}