ajax实例

最新推荐文章于 2021-08-06 13:02:54 发布

最新推荐文章于 2021-08-06 13:02:54 发布 · 114 阅读

文章标签：

#Ajax #IE #浏览器 #Safari #Microsoft

javascript 专栏收录该内容

8 篇文章

订阅专栏

本文介绍了一个使用Ajax进行异步调用的例子。该示例展示了如何通过JavaScript创建XMLHttpRequest对象，并向服务器发起POST请求来合成某些内容。文章还解释了如何处理服务器响应并将结果展示在页面上。

<script>
var XmlHttpRequest;
function callAjax(){
	document.getElementById('tips').innerHTML='正在合成......';
                                    
		//创建ajax核心 xmlHttpRequest		  
		        XmlHttpRequest = false;   
		        //下面需要建立一个XMLHttpRequest对象,用它进行服务器请求,针cf 不同浏览器建立方法不同   
		        if (window.XMLHttpRequest)   
		        { // Mozilla, Safari,...   
		            XmlHttpRequest = new XMLHttpRequest();   
		            if (XmlHttpRequest.overrideMimeType)   
		            {   
		                XmlHttpRequest.overrideMimeType('text/xml');   
		            }   
		        }   
		        else if (window.ActiveXObject)   
		        { // IE   
		            try             {   
		                XmlHttpRequest = new ActiveXObject("Msxml2.XMLHTTP");   
		            }   
		            catch (e)   
		            {   
		                try  
		                {   
		                    XmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");   
		                }   
		                catch (e) {}   
		            }   
		        }   
		          
		        if (!XmlHttpRequest) {   
		            alert('出现错误,不能建立一个XMLHTTP实例!');   
		            return false;   
		        } 

		        
		var content=document.getElementById('content').value;
	//	var isIE= document.all ? true : false;//告诉sevlet是不是IE 浏览器
		var speed=document.getElementById('speakingRate').value;

		var postStr ="content="+content+"&speed="+speed;
		
		XmlHttpRequest.onreadystatechange=callBack;//设置回调的js函数  就是说发送请求 服务器响应后 回来执行的js函数   callBack是函数名
		XmlHttpRequest.open("POST","../experience",true);//第一个参数是请求类型（GET/POST） 第二个请求服务器路径 你可以写一个servlet地址 
		XmlHttpRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");   
		XmlHttpRequest.send(postStr);//开始向服务器发送xmlHttpRequest
		

}

//<!--回调的方法-->
function callBack(){
	
	if(XmlHttpRequest.readyState==4)
	{
		if(XmlHttpRequest.status==200)//以上两个判断 确定ajax请求已被成功相应
		{
			
		 var result = XmlHttpRequest.responseText;   //取出相应信息
		 /* 然后在这里执行相应后的信息,比如直接提示服务器相应的信息*/
	
		 if(document.getElementById('accplayer'))document.getElementById('accplayer').src=result;
		 if(document.getElementById('iframe_pynon_0'))document.getElementById('iframe_pynon_0').src=result;
		}
	}
}

</script>