ajax例子(ajax例子详解)

http://www.itjxue.com  2023-01-25 04:32  来源:未知  点击次数: 

ajax跨域到底是什么意思?能否举个简单例子说明一下?

Ajax请求一个目标地址为非本域(协议、域名、端口任意一个不同)的web资源,并根据响应获得外部应用数据。比如我们用Ajax访问城市天气预报、IP地址等公共服务接口时,就涉及跨域了。我们请求一个外部服务时,浏览器会基于安全问题拒绝授权访问。而script、script、iframe标签的src属性就不存在跨域的问题,所以Ajax跨域就是利用这一点以及js对JSON的支持,外部服务只要给Ajax的请求响应一段JS代码或JSON数据,就能被Ajax获取到。

比如jquery的getScript

$.getScript("//pv.sohu.com/cityjson",function(){//前面加上http

????//这个服务给响应的js代码为

????//returnCitySN?=?{cid:?"110000",?cip:?"124.xxx.22.xxx",?cname:?"北京市"}

????//回调函数执行前,外部服务给响应的js代码已被加载到本地,所以可以直接使用。

????console.log("cid?:?"?+?returnCitySN.cid);

????console.log("cip?:?"?+?returnCitySN.cip);

????console.log("cname?:?"?+?returnCitySN.cname);

});

什么是AJAX,列举AJAX的常见应用

页面无刷新技术。比如google的邮箱就是用了AJAX。

举个例子:你在某个用AJAX技术的网页上登陆用户。点“登陆”后发现就登陆那一小块刷新成你登陆以后的信息了。别的地方没刷。这就是AJAX

一个简单的Ajax例子?

/*****************JS************************/

var xmlHttp = false; //定义一个变量用来存放XMLHttpRequest对象

//检测用户名是否唯一的请求

function createXmlHttpRequest()

{

if(window.ActiveXObject)

{

xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

}

else if(window.XMLHttpRequest)

{

xmlHttp = new XMLHttpRequest();

}

if(!xmlHttp typeof XMLHttpRequest != 'undefined')

{

xmlHttp = new XMLHttpRequest();

}

}

/*=====================动态改变页面信息开始===================================*/

//动态改变页面

function dynamicUpdate()

{

createXmlHttpRequest();

var URL = "../ServerPage.aspx?task=reset";

xmlHttp.open("GET",URL,true);

xmlHttp.onreadystatechange = dynamicUpdateInfo;

xmlHttp.send(null);

}

//动态改变页面回调函数

function dynamicUpdateInfo()

{

if(xmlHttp.readyState == 4)

{

if(xmlHttp.status == 200)

{

setTimeout("pollServer()",5000);

}

}

}

/********************后台************************/

protected void Page_Load(object sender, EventArgs e)

{

string task = Request.QueryString["task"].ToString();

//处理

}

AJAX请求类实例代码

AJAX请求类实例代码

代码如下:

// AJAX类

function AJAXRequest() {

var xmlObj = false;

var CBfunc,ObjSelf;

ObjSelf=this;

try { xmlObj=new XMLHttpRequest; }

catch(e) {

try { xmlObj=new ActiveXObject("MSXML2.XMLHTTP"); }

catch(e2) {

try { xmlObj=new ActiveXObject("Microsoft.XMLHTTP"); }

catch(e3) { xmlObj=false; }

}

}

if (!xmlObj) return false;

this.method="POST";

this.url;

this.async=true;

this.content="";

this.callback=function(cbobj) {return;}

this.send=function() {

if(!this.method||!this.url||!this.async) return false;

xmlObj.open (this.method, this.url, this.async);

if(this.method=="POST") xmlObj.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

xmlObj.onreadystatechange=function() {

if(xmlObj.readyState==4) {

if(xmlObj.status==200) {

ObjSelf.callback(xmlObj);

}

}

}

if(this.method=="POST") xmlObj.send(this.content);

else xmlObj.send(null);

}

}

AJAX请求类

by HotHeart(热血心肠)

Site:

Blog:

类名:AJAX

创建方法:var ajaxobj=new AJAX;,如果创建失败则返回false

属性:method - 请求方法,字符串,POST或者GET,默认为POST

url - 请求URL,字符串,默认为空

async - 是否异步,true为异步,false为同步,默认为true

content - 请求的内容,如果请求方法为POST需要设定此属性,默认为空

callback - 回调函数,即返回响应内容时调用的函数,默认为直接返回,回调函数有一个参数为XMLHttpRequest对象,即定义回调函数时要这样:function mycallback(xmlobj)

方法:send() - 发送请求,无参数

一个例子:

var ajaxobj=new AJAXRequest; // 创建AJAX对象

ajaxobj.method="GET"; // 设置请求方式为GET

ajaxobj.url="default.asp" // URL为default.asp

// 设置回调函数,输出响应内容

ajaxobj.callback=function(xmlobj) {

document.write(xmlobj.responseText);

}

ajaxobj.send(); // 发送请求 ;

AJAX是什么?如何在JavaScript中使用

JavaScript能流行,一个很重要的原因是AJAX技术的应用。在网页中有很多的应用。举两个常见的AJAX应用的例子:

1、 在搜索中,我们输入关键字时,网页会实时展现搜索结果;这是用AJAX实现的。

2、 使用地图时,地图会根据用户显示的位置不停的更新。这也是通过AJAX实现。

那么什么是AJAX呢?

AJAX全称为Asynchronous JavaScript And XML直译就是异步的JavaScript和XML(这里我们主要介绍下JavaScript中AJAX的应用)

通常当JavaScript向服务器发送请求获取数据时,服务器会返回数据。在传统没有使用AJAX的网页中,需要刷新页面使其重新加载。而AJAX可以使网页在不重新加载页面的情况下对网页的局部进行更新。(比如,当你要放大地图的时候,你会不断的向服务器请求地图当前位置的详细信息,服务器返回数据给你,这里我们并不需要重新加载整个页面,不然用户体验就太差了。而是局部更新页面。)

由于我不可能在这写一个地图这样复杂的例子,而为了演示AJAX的使用,我借用了秒秒学的一个简单示例:

// 简单的AJAX举例。

// 1: 创建请求变量

var myRequest;

// 浏览器的特征检查。

if (window.XMLHttpRequest) { //若支持,则是火狐、谷歌等浏览器。

myRequest = new XMLHttpRequest();

} else if (window.ActiveXObject) { // 若不支持, 则是IE浏览器。

myRequest = new ActiveXObject("Microsoft.XMLHTTP");

}

// 2: 为请求添加事件处理代码。

myRequest.onreadystatechange = function(){

console.log("匿名函数被调用!");

console.log(myRequest.readyState);

if (myRequest.readyState === 4) {

var p = document.createElement("p");

var t = document.createTextNode(myRequest.responseText);

p.appendChild(t);

document.getElementById("mainContent").appendChild(p);

}

};

// 3: 配置发送请求

myRequest.open('GET', 'simple.txt', true);

myRequest.send(null);

//....

使用AJAX主要分三部分,如示例中的

1、 创建请求的变量。

在script文件中,首先声明XMLHttpRequest对象,这也是题主说的Ajax的核心。浏览器页面能通过XMLHttpRequest对象和服务器进行通讯。因为这个对象的创建因浏览器的不同而有区别。所以我们要用if语句判断XMLHttpRequest是否存在。

2、 为请求添加事件处理代码

创建好XMLHttpRequest对象后,就可以向服务器发送请求了,不过我们首先处理服务器响应的事件。当服务器响应后会触发myRequest对象的onreadystatechange事件。

在onreadystatechange事件中我们看到myRequest调用了readyState属性,readyState有4个值表示目前响应所在的阶段,各数值表示如下:

l 1:请求已经建立,但是还没有发送(还没有调用 send())。

l 2:请求已发送,正在处理中(通常现在可以从响应中获取内容头)。

l 3:请求在处理中;通常响应中已有部分数据可用了,但是服务器还没有完成响应的生成。

l 4:响应已完成;您可以获取并使用服务器的响应了。

我们一般只关心readyState的值为4的情况,表示响应已完成。

3、 配置发送请求

使用open方法配置请求。它有三个参数:

1、第一个参数表示用GET获取服务器中的数据。

2、第二个参数是一个服务器地址,这里我们用本地的simple.txt代替,省去创建服务器的麻烦。

3、第三个参数true表示请求是异步的,即当请求发送后,JavaScript不会为了等待服务器的响应而阻塞,它会继续执行后续代码。

配置好请求后,用send方法发送请求,这里给send传递的参数是null,若有其它参数需要发送,也可以传递给send方法。

这样AJAX的简单使用例子就说完了,以上示例来自教程网站秒秒学,希望对你有帮助。

ajax用在哪些地方(求列举点实际应用的例子..)

AJAX可以用在任何你要进行数据库交互的地方.但是,虽然这么说,也不能全部都用AJAX写程序.如果客户端不支持JS或者出了什么问题你这个程序就完啦...

呵呵..在某些不刷新而要与数据库交互的地方可以用上这个.

我们做网站就要有良好的用户体验.

在某些要登录才能发贴的地方可以用上.比如说,用户写了好长一篇文章.提交后才发现,session过期.而导致跳转到登录页了,他写的东西那就全没了.这样对用户来说,就不太友好了.所以我们可以AJAX判断一下是否要登录.再弹出相应的提示.

还有就是表单内容多的地方,用户填写了好几十项.提交后发现一项不合要求.返回后又重新填写信息,这样的话,一般人都不会再去填那好几十项了.除非他真的要你网站的资源,而你又要他注册后才可用..

总之.AJAX可以用于网站的任何交互页面,但是也要注意控制量.并非都用AJAX那就是一个很棒的网站.关键还是在于用户

(责任编辑:IT教学网)

更多

推荐测评专题文章