Ajax+jQuery实现LightBox与服务器通信

核心提示： 第一步当然是获得查询参数，之后再作为函数的参数用函数对其进行处理，Ajax+jQuery实现LightBox与服务器通信(5)，我这里是模仿了一个登录，至于怎么样从数据库中查出数据以及查出什么数据不是我们这篇文章要讨论的问题，这里和服务端的交互只是个演示，在实际运用时可千万别直接就这样，

第一步当然是获得查询参数。之后再作为函数的参数用函数对其进行处理。我这里是模仿了一个登录。至于怎么样从数据库中查出数据以及查出什么数据不是我们这篇文章要讨论的问题。这里不多说。关键是下面几句

1　　　　　　　　　　　　 Response.ContentType = "text/plain";
2　　　　　　　　　　　　 Response.AppendHeader("Cache-Control", "no-cache");
3　　　　　　　　　　　　 Response.AppendHeader("Pragma", "no-cache");
4　　　　　　　　　　　　 Response.Write("欢迎：" + Session["UserName"]);
5　　　　　　　　　　　　 Response.End();
6　

第一句是设置XMLHttpRequest对象返回的类型。我这里设置的是纯文本。也可以设置成“text/xml”。这样返回的就是xml类型的。在客户端可以用DOM获取里面的内容。接下去的两句是设置首部，使浏览器不会在本地缓存结果。之所以要设置两个是为了向后兼容。然后那句大家就应该很熟悉了——输出内容。最后是关闭或者说结束response对象。

现在服务端已经返回数据了，看在客户端的接收。

　1 function CallBack()
　2 {
　3　　　　 if(xmlHttp.readyState==4)
　4　　　　 {
　5　　　　　　　　 if(xmlHttp.status==200)
　6　　　　　　　　 {
　7　　　　　　　　　　　　 var strMeesage=xmlHttp.responseText;
　8　　　　　　　　　　　　 InsertMessage(strMeesage);
　9　　　　　　　　 }
10　　　　 }
11 }
12

这里很简单，直接获取responseText，然后仍给InsertMessage（）去处理

1 function InsertMessage(message)
2 {
3　　　　 $("#formLogin").remove();
4　　　　 $("#lightBox").append("<div>"+message+"</div>");
5 }
6

这也很简单，把刚才登录的表单移除，再直接把内容扔到一个div里送显。这样基本上就是完成了！

ps。这里和服务端的交互只是个演示。在实际运用时可千万别直接就这样。我是说直接把登录的用户名和密码都用明文直接放到url里！哈哈。