首页 > Web开发 > 详细

jQuery AJAX

时间:2019-08-12 20:38:01      阅读:120      评论:0      收藏:0      [点我收藏+]

AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML)

jQuery 参考手册 - Ajax

jQuery load() 方法

load()方法通常用来从Web服务器上获取静态的数据文件

load()方法是jQuery中最为简单和常用的Ajax方法,能载入远程HTML代码并插入DOM中。

load() 方法从服务器加载数据,并把返回的数据放入被选元素中。
    $(selector).load(URL,data,callback);
必需的 URL 参数规定您希望加载的 URL。
可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。
可选的 callback 参数是 load() 方法完成后所执行的函数名称。

$(function(){
      $("#send").click(function(){
              $("#resText").load("test.html");
      })
})

如果只需要加载test.html页面内的某些元素:
    $("#resText").load("test.html  .para");
注意,URL和选择器之间有一个空格

jQuery get() 和 post() 方法

$.get() 方法通过 HTTP GET 请求从服务器上请求数据。
    $.get(url,[data],[callback],[type])
url        String        请求的HTML页的URL地址
data(可选)        Object        发送至服务器的key/value数据会作为QueryString附加到请求URL中
callback(可选)        Function        载入成功时回调函数(只有当Response的返回状态是success才调用该方法)自动将请求结果和状态传递给该方法
type(可选)        String        服务器端返回内容的样式,包括xml、html、script、json、text和_default

$(function(){
       $("#send").click(function(){
            $.get("url", 
                    { 
                      username :  $("#username").val() , 
                      content :  $("#content").val()  
                    },
                    function (data, textStatus){
                        $("#resText").html(data); // 把返回的数据添加到页面上
                    }
            );
       })
})

$.post() 方法通过 HTTP POST 请求从服务器上请求数据。
    $.post(url,[data],[callback],[type]);
必需的 URL 参数规定您希望请求的 URL。
可选的 data 参数规定连同请求发送的数据。
可选的 callback 参数是请求成功后所执行的函数名。

<script>
$(document).ready(function(){
  $("button").click(function(){
    $.post("/example/jquery/demo_test_post.asp",
                {
                  name:"Donald Duck",
                  city:"Duckburg"
                },
                function(data,status){
                  alert("数据:" + data + "\n状态:" + status);
                });
  });
});
</script>

$.get()和$.post()方法是jQuery中的全局函数,而在此之前讲的load()是对jQuery对象进行操作的。

jQuery AJAX

原文:https://www.cnblogs.com/loveer/p/11342242.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!