Ajax基础

最新推荐文章于 2022-04-03 00:32:42 发布

zhou-boy

最新推荐文章于 2022-04-03 00:32:42 发布

阅读量92

点赞数 1

分类专栏： Ajax

本文链接：https://blog.csdn.net/qq_43632167/article/details/109713056

版权

Ajax 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

XMLHttpRequest的几个方法和属性

● open()：建立到服务器的新请求。

● send()：向服务器发送请求。

● abort()：退出当前请求。

● readyState：提供当前 HTML 的就绪状态。

● responseText：服务器返回的请求响应文本。

创建新的 XMLHttpRequest 对象

var request = new XMLHttpRequest();

javascript 不要求指定变量类型

在 Java 语言中可能需要这样(创建 XMLHttpRequest 的 Java 伪代码)

XMlHttpRequest request = new XMLHttpRequest();

错误处理

1：创建一个新的变量`request`并赋值`false`。后面将使用`false`作为判定条件，它表示还没创建`XMLHttpRequest`对象

2：增加`try/catch`块

1）尝试创建`XMLHttpRequst`对象。

2）如果失败（`catch(failed)`）则保证`request`的值仍然为`false`。

3：检查`request`是否仍为`false`（如果一切正常就不会是fasle）。

4：如果出现问题（request是false）则使用javascript警告通知用户出现了问题。

var request = false;
try{
    request = new XMLHttpRequest();
}catch(failed){
	request = false;
}
if(!request)
    alert("Error initializingXMLHttpRequest!");

增加对 Microsoft 浏览器的支持

1：创建一个新变量`request`并赋值`false`。使用false作为判断条件，他表示还没有创建XMLHttpRequest对象。

2：增加`try/catch`块

1）尝试使用较新版本的Microsoft浏览器创建Microsoft兼容对象（`Msxml2.XMLHttp`）。

2）如果失败（`catch(othermicrosoft)`）尝试使用较老版本的Microsoft浏览器创建Microsoft兼容的对象（`Microsoft.XMLHttp`）.

3）如果失败（`catch(failed)`）则保证`request`的值仍然为`false`

3：检查`request`是否仍然为`false`（如果一切顺利就不会是`false`）。

4：如果出现问题（`request`是`false`）则使用javascript警告通知用户出现问题。

var request = false;
try{
    request = XMLHttpRequest();
}catch(trymicrosoft){
	try{
        request = new ActiveXObject("Msxml2.XMLHTTP");
    }catch(othermicrosoft){
        try{
            request = new ActiveXObiect("Microsoft.XMLHTTP");
        }catch(failed){
            request = false;
        }
    }
}
if(!request)
    alert("Error initializing XMLHttpRequest!");

将 XMLHttpRequest 创建代码移动到方法中

var request = flase;
function createRequest() {
 try {
 	request = new XMLHttpRequest();
 } catch (trymicrosoft) {
     try {
     	request = new ActiveXObject("Msxml2.XMLHTTP");
     } catch (othermicrosoft) {
         try {
         	request = new ActiveXObject("Microsoft.XMLHTTP");
         } catch (failed) {
         	request = false;
         }
     }
 }
 if (!request)
 	alert("Error initializing XMLHttpRequest!");
}
function getCustomerInfo() {
 createRequest();
 // Do something with the request variable
}

用 XMLHttpRequest 发送请求

得到请求对象之后就可以进入请求/响应循环了。记住，XMLHttpRequest 惟一的目的是让您发送请求和接

收响应。其他一切都是 javascript、CSS 或页面中其他代码的工作：改变用户界面、切换图像、解释服务器

返回的数据。

设置服务器 URL

首先要确定连接的服务器的 URL。这并不是 Ajax 的特殊要求，但仍然是建立连接所必需的，

建立请求 URL

<body>
    <form action="POST">
     <p>Enter your phone number:
            <!--getCustomerInfo() 方法。该方法取得电话号码并构造存储在 url 变量中的 URL 字符串。-->
         <input type="text" size="14" name="phone" id="phone" onChange="getCustomerInfo();" />
     </p>
    </form>
</body>
<script>
    var request = false;
    try{
        request = XMLHttpRequest();
    }catch(trymicrosoft){
        try{
            request = new ActiveXObject("Msxml2.XMLHTTP");
        }catch(othermicrosoft){
            try{
                request = new ActiveXObiect("Microsoft.XMLHTTP");
            }catch(failed){
                request = false;
            }
        }
    }
    if(!request)
        alert("Error initializing XMLHttpRequest!");
    function getCustomerInfo() {
        var phone = document.getElementById("phone").value;
        /*
        *escape() 方法，它用于转义不能用明文正确发送的任何字符。比如，电话号码中的空格
将被转换成字符 %20，从而能够在 URL 中传递这些字符。
  *可以根据需要添加任意多个参数。比如，如果需要增加另一个参数，只需要将其附加到 URL 中并用 
“与”（&）字符分开 [第一个参数用问号（?）和脚本名分开]	
  */
        var url = "/cgi-local/lookupCustomer.php?phone=" + escape(phone);
    }
</script>

zhou-boy

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Ajax基础

XMLHttpRequest的几个方法和属性● open()：建立到服务器的新请求。● send()：向服务器发送请求。● abort()：退出当前请求。● readyState：提供当前 HTML 的就绪状态。● responseText：服务器返回的请求响应文本。创建新的 XMLHttpRequest 对象var request = new XMLHttpRequest();javascript 不要求指定变量类型在 Java 语言中可能需要这样(创建 XMLHttpRequest
复制链接

扫一扫