zoukankan      html  css  js  c++  java
  • jquery中对ajax在项目中的应用

    项目中主要采用servlet,jsp,jdbc,js,html,css等编程语言,本文主要说说项目中用到的js框架jquery对ajax的支持。

    首先说说原生ajax,先获取XMLHttprequest对象,还要设置浏览器兼容问题,官方推荐代码

    function getXMLHttpRequest() {
        var xmlHttpReq=null;
        if (window.XMLHttpRequest) {//Mozilla 浏览器
            xmlHttpReq = new XMLHttpRequest();
        }else {
            if (window.ActiveXObject) {//IE 浏览器
                try {
                    xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
                }
                catch (e) {
                    try {//IE 浏览器
                        xmlHttpReq = new ActiveXObject("Msxml2.XMLHTTP");
                    }
                    catch (e) {
                    }
                }
            }
        }
        return xmlHttpReq;
    }

    获取对象成功后就是一些方法的调用

    xmlhttp.open("GET","url",true); xmlhttp.send();打开连接,发送get请求于url,true表示异步请求,发送请求

    还可以添加请求头信息setRequestHeader(header,value)

    向请求添加 HTTP 头。header: 规定头的名称value: 规定头的值

    发送请求回调函数,处理得到的结果

    xmlhttp.onreadystatechange=function()
      {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
      }

    对于xml和json数据的处理,这里不再叙述

    关于jquery对ajax的处理,比较简单,易于上手,不用考虑浏览器兼容问题

    在引入jquery的js文件后

    load(url, [data], [callback]),这是一个要接收数据的标签

     $("#feeds").load("feeds.php", {limit: 25}, function(){
       alert("The last 25 entries in the feed have been loaded");
     });

    参数依次为请求url,超时时间,结果回调

    jQuery.get(url, [data], [callback], [type])

    相对于load,这是一个可以直接使用的函数,传入请求url,发送的数据,回调函数,类型

    官方参数说明

        url:待载入页面的URL地址

        data:待发送 Key/value 参数。

        callback:载入成功时回调函数。

        type:返回内容格式,xml, html, script, json, text, _default。

    jQuery.getJSON(url, [data], [callback])这是对.get的封装,type为json格式

    jQuery.post(url, [data], [callback], [type]) post请求,方法参数同get

    例如项目中

    $.post("StuList4Work", json, function(data, textStatus){},"json")

    post请求StuList4Work这个servlet,发送一个json数据,服务通过request.getParameter获取参数结果

    data为服务器返回的json格式的数据 textStatus为返回状态,类型为suceess,faile

    比较功能复杂,又能解决不同需求的是$.ajax 即 jQuery.ajax(url,[settings])

    seething选项有好多可选的,比较常用的有如下几个

    async    Boolean

    (默认: true) 默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。

    beforeSend(XHR)    Function

    发送请求前可修改 XMLHttpRequest 对象的函数,如添加自定义 HTTP 头。XMLHttpRequest 对象是唯一的参数。这是一个 Ajax 事件。如果返回false可以取消本次ajax请求。

    context        Object

    这个对象用于设置Ajax相关回调函数的上下文。也就是说,让回调函数内this指向这个对象(如果不设定这个参数,那么this就指向调用本次AJAX请求时传递的options参数)。比如指定一个DOM元素作为context参数,这样就设置了success回调函数的上下文为这个DOM元素。

    data          Object,String

    发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。如果为数组,jQuery 将自动为不同值对应同一个名称。

    data      TypeString

    预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如XML MIME类型就被识别为XML。在1.4中,JSON就会生成一个JavaScript对象,而script则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。可用值:

    "xml": 返回 XML 文档,可用 jQuery 处理。

    "html": 返回纯文本 HTML 信息;包含的script标签会在插入dom时执行。

    "script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了"cache"参数。'''注意:'''在远程请求时(不在同一个域下),所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)

    "json": 返回 JSON 数据 。

    "jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。

    "text": 返回纯文本字符串

    error      Function

    (默认: 自动判断 (xml 或 html)) 请求失败时调用此函数。有以下三个参数:XMLHttpRequest 对象、错误信息、(可选)捕获的异常对象。如果发生了错误,错误信息(第二个参数)除了得到null之外,还可能是"timeout", "error", "notmodified" 和 "parsererror"。

    jsonp    String

    在一个jsonp请求中重写回调函数的名字。这个值用来替代在"callback=?"这种GET或POST请求中URL参数里的"callback"部分,比如{jsonp:'onJsonPLoad'}会导致将"onJsonPLoad=?"传给服务器。

    statusCode    map

    默认: {}

    一组数值的HTTP代码和函数对象,当响应时调用了相应的代码。

    success(data, textStatus, jqXHR)      Function,Array

    请求成功后的回调函数。参数:由服务器返回,并根据dataType参数进行处理后的数据;描述状态的字符串。还有 jqXHR(在jQuery 1.4.x的中,XMLHttpRequest) 对象 。在jQuery 1.5, 成功设置可以接受一个函数数组。每个函数将被依次调用。

    timeout    Number

    设置请求超时时间(毫秒)。此设置将覆盖全局设置。

    type    String

    (默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET"。注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持。

    url    String

    (默认: 当前页地址) 发送请求的地址。

    xhr    Function

    需要返回一个XMLHttpRequest 对象。默认在IE下是ActiveXObject 而其他情况下是XMLHttpRequest 。用于重写或者提供一个增强的XMLHttpRequest 对象。

                                                                                                                                                       

  • 相关阅读:
    C#网络编程之---TCP协议的同步通信(二)
    CentOS6.4 X86_64 kvm+PXE备忘
    Rsyslog远程传输的几种方式
    ADB工具【转载】
    docker 常用命令
    容灾测试(未完)
    docker 运维实践
    Day 15 图像和办公文档的处理
    服务器调优
    软件测试1 正规流程
  • 原文地址:https://www.cnblogs.com/zqq1234/p/5412286.html
Copyright © 2011-2022 走看看