首页 > 代码库 > Ajax的介绍和优点

Ajax的介绍和优点

2024-08-11 22:52:03   218人阅读

 
        1. 局部刷新
        2. 按需取数据        
二、创建Ajax对象， 这是学习Ajax的第一步
    主要是把浏览器分成两种
一种是IE系列的浏览器（IE5.0 IE5.5 IE6.0, IE7 IE8）
一种是非IE浏览器(都是按W3C标准) FF Mozilla NetScape
abort()                    停止当前请求
getAllResponseHeaders()            作为字符串返回完整的headers
getResponseHeader("headerLabel")    作为字符串返回单个的header标签
 
send(content)                发送请求
 
onreadystatechange    状态改变的事件触发器
readyState        对象状态(integer):
                  0 = 未初始化 1 = 读取中2 = 已读取3 = 交互中4 = 完成
responseText        服务器进程返回数据的文本版本
responseXML        服务器进程返回数据的兼容DOM的XML文档对象
 
statusText        服务器返回的状态文本信息
 
 
 
    有了一个这样的页面之后，我们要回到请求页，相信学过网页的同学对script标签应该非常熟悉把，是的，接下来的代码就是要书写在script标签中。大家应该知道我们网页中是事件，如鼠标点击事件，鼠标悬停事件，键盘起落事件等等，而发送Ajax请求就是要通过事件来完成，下面我们就用代码来给大家建立一个最基本的Ajax请求：
技术分享
技术分享
script ="text/javascript"> functionvarnewvar url = "ajax.jsp?q=" + val; url = url + "&sid=" + Math.random(); xmlHttp.open("GET", url, true); xmlHttp.send(); document.getElementById("sun").innerHTML = xmlHttp.responseText; } scriptheadbodyforminput ="text"="tname"="" /> <type name value onclickform 你提交的数据是： span ="sun"></> </> </>
技术分享
技术分享
因为要对数据进行的操作很少，所以ajax.jsp页面的代码异常简单：
技术分享
技术分享
body<% name = request.getParameter(); out.print(name); %> bodyhtml技术分享
技术分享
技术分享
技术分享
技术分享
script ="text/javascript"="jQuery1.11.1.js"></> <type sayHi(){ $.ajax({ cache: , type: "POST", url:"ajax.jsp", data:$(‘#frm‘).serialize(), async: , error: (request) { alert("请求失败！"); }, success: (data) { $("#d").html(data); } }); } scriptheadbodyform ="frm" > <type name valueinput ="button"="提交"="sayHi();"/> <iddivformbodyhtml技术分享
技术分享
技术分享
技术分享
body<% userName = request.getParameter(); out.print(userName+); %> bodyhtml技术分享
技术分享
 

Ajax的介绍和优点


联系
我们