您的位置:首页 > Web前端 > JavaScript

纯js异步无刷新请求(只支持IE)【原】

2016-08-18 14:58 344 查看

纯js异步无刷新请求

下载地址:http://pan.baidu.com/s/1slakL1F

所以因为非IE浏览器都禁止跨域请求,所以以只支持IE.

<HTML>
<!-- 乱码(未实践是否有用) http://blog.csdn.net/myfuturein/article/details/6603500 -->
<HEAD>
<!--  meta 解释 :  http://www.haorooms.com/post/html_meta_ds -->
<meta http-equiv="content-Type"content="text/html;charset=gbk">
<meta name="author" content="king">
<style>
*{ margin:2;padding:0;}
.top{background:#5DF5FD; height:20px; position:fixed; z-index:8000;width:100%}
.width99{width:99%;padding:0;}

</style>

<TITLE>纯js异步无刷新请求</TITLE>

<script type="text/javascript">
var xmlHttpRequest;
//XmlHttpRequest对象
function createXmlHttpRequest(){
if(window.ActiveXObject){ //如果是IE
return new ActiveXObject("Microsoft.XMLHTTP");
}else if(window.XMLHttpRequest){ //非IE浏览器
return new XMLHttpRequest();
}
}
function sendRequest(){
// "http://localhost:8080/httpserver?a=2";

var url = document.getElementById("url").value;
//1.创建XMLHttpRequest组建
xmlHttpRequest = createXmlHttpRequest();

//2.设置回调函数
xmlHttpRequest.onreadystatechange = callbackFunc;

//3.初始化XMLHttpRequest组建
xmlHttpRequest.open("post",url,true);

//4.发送请求
var requestXml = document.getElementById("requestData").innerText;
xmlHttpRequest.send(requestXml);
}
//回调函数
function callbackFunc(){
if(xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){
var response = xmlHttpRequest.responseText;
document.getElementById("responseData").innerText=response;
}
}

//enter键按下
function KeyDown()
{
if (event.keyCode == 13){
event.returnValue=false;
event.cancel = true;
document.getElementById("sendButton").click(); //调用请求按钮的单击事件
}
}

</script>
</HEAD>
<BODY>
<nav class="" ><span></span></nav><br/><br/>

<div>
<input id="url" type="text"  value="http://localhost:8080/httpserver?a=2" class="width99" style="font-size:17px" title="请求地址"  onkeydown="KeyDown()"/>
</div>
<div style="float: left ;width: 42%">
<textarea id="requestData" class="width99"  rows="30" title="请求报文" ></textarea>

</div>
<div style="float: left;width: 56%">
<button id="sendButton" onclick="sendRequest()" ><font size="5">单击请求</font></button>
<textarea id="responseData" class="width99" rows="30" title="返回报文"></textarea>
</div>

</BODY>
</HTML>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: