zoukankan      html  css  js  c++  java
  • ajax(通过jQuery实现)

    使用jQuery实现ajax相对来说方便一点,看w3cschool有几种实现的方法,我就总结一下自己以后会用到的几种方法

    $.ajax方法:

    $.ajax方法里面有很多个参数可以使用,但我这里就写自己常用的几个参数:

    1.url:

    要求为String类型的参数,(默认为当前页地址)发送请求的地址。

    2.timeout:

    要求为Number类型的参数,设置请求超时时间(毫秒)。此设置将覆盖$.ajaxSetup()方法的全局设置。

    3.data:

    发送服务器附加的请求数据,get请求中将这些请求附加到url后面,对象必须为key/value格式,例如{foo1:"bar1",foo2:"bar2"}转换为&foo1=bar1&foo2=bar2。如果是数组,JQuery将自动为不同值对应同一个名称。例如{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2。

    4.dataType:

    指定返回数据类型,可用xml,html,script,json,jsonp,text;

     5.success:

    要求为Function类型的参数,请求成功后调用的回调函数,有两个参数。
    (1)由服务器返回,并根据dataType参数进行处理后的数据。
    (2)描述状态的字符串。
     function(data, textStatus){
           //data可能是xmlDoc、jsonObj、html、text等等
           this;  //调用本次ajax请求时传递的options参数
    }

    6.error

    要求为Function类型的参数,请求失败时被调用的函数。该函数有3个参数,即XMLHttpRequest对象、错误信息、捕获的错误对象(可选)。ajax事件函数如下:
           function(XMLHttpRequest, textStatus, errorThrown){
              //通常情况下textStatus和errorThrown只有其中一个包含信息
              this;   //调用本次ajax请求时传递的options参数
           }

     

     这里写一个实例

    $(document).ready(function(){
        $.ajax({
            url:'test_server.php',
            data:{mes:$('#sb').val()},
            type:'POST',
            dataType:'json',
            success:function(data){
                $.each(data,function(key,value){
                    alert(value);
                });
            }
        });
    });

    其实jQuery还封装了很多ajax的方法,我还用过$.get,$.post,比$.ajax更简单,但可选参数变少了,w3cschool已经写得很好了。贴个参数。。

    jQuery.post(url,data,success(data, textStatus, jqXHR),dataType)
    参数描述
    url 必需。规定把请求发送到哪个 URL。
    data 可选。映射或字符串值。规定连同请求发送到服务器的数据。
    success(data, textStatus, jqXHR) 可选。请求成功时执行的回调函数。
    dataType

    可选。规定预期的服务器响应的数据类型。

    默认执行智能判断(xml、json、script 或 html)。

    我就自己贴两个例子

     1 $(document).ready(function(){
     2     $('#sb').keyup(function(){
     3         $.get('test_server.php',{mes:$('#sb').val()},function(data){
     4             $('#sbb').val(data);
     5         });
     6     });
     7 });
     8 
     9 $(document).ready(function(){
    10     $('#sb').keyup(function(){
    11         $.post('test_server.php',{mes:$('#sb').val()},function(data){
    12             $('#sbb').val(data);
    13         });
    14     });
    15 });
  • 相关阅读:
    港湾交换机-交换机配置
    华为交换机-SNMP配置
    H3C交换机-SNMP配置
    CISCO交换机-SNMP配置
    docker容器与宿主交互数据
    MYSQL总览
    mysql数据类型优化
    compact 创建一个包含变量名为数组的键和它们的值为数组的值的数组
    php单例模式
    完形填空格式
  • 原文地址:https://www.cnblogs.com/s-b-b/p/5282308.html
Copyright © 2011-2022 走看看