首页 > 其他分享 >jQuery - AJAX load() 方法

jQuery - AJAX load() 方法

时间:2023-03-05 10:31:58浏览次数:34  
标签:jQuery load URL AJAX 参数 function txt 加载


load() 方法从服务器加载数据,并把返回的数据放入被选元素中。
语法:

$(selector).load(URL,data,callback);

参数说明:


必需的 URL 参数规定您希望加载的 URL。

可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。

可选的 callback 参数是 load() 方法完成后所执行的函数名称。


实例:


</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").load("/try/ajax/demo_test.txt",function(responseTxt,statusTxt,xhr){
if(statusTxt=="success")
alert("外部内容加载成功!");
if(statusTxt=="error")
alert("Error: "+xhr.status+": "+xhr.statusText);
});
});
});
</script>



demo_test.txt内容:

<h2>jQuery and AJAX is FUN!!!</h2>

<p id="p1">This is some text in a paragraph.</p>


知识点:

(1)可以把 jQuery 选择器添加到 URL 参数中,与url之间用空格隔开。

如:

下面把 "demo_test.txt" 文件中 id="p1" 的元素的内容,加载到指定的 <div> 元素中:

实例

$("#div1").load("demo_test.txt #p1");


如上所示只有id = p1 的元素才加载 


(2) load() 方法默认为get请求

get方式提交:data参数为空,url添加所要提交的值

若data不为空则为以post方式提交:

//无回调函数
$("#showload").load("load.htm", { "para": "para-value" });
$("#showload").load("load.htm", { "para": "para-value" },
function() {
//处理
})


(3)回调函数讲解:


可选的 callback 参数规定当 load() 方法完成后所要允许的回调函数。回调函数可以设置不同的参数:


responseTxt - 包含调用成功时的结果内容


statusTXT - 包含调用的状态("success",  "error", "notmodified","timeout" 或 "parsererror"),主要用success和error


xhr - 包含 XMLHttpRequest 对象



xhr对象包括以下几部分:

responseText    作为响应主体被返回的文本

responseXML    如果响应主体内容类型是"text/xml"或"application/xml",则返回包含响应数据的XML DOM文档

atatus    响应的HTTP状态

statusText    http状态说明



jQuery - AJAX  load() 方法_加载




标签:jQuery,load,URL,AJAX,参数,function,txt,加载
From: https://blog.51cto.com/sdwml/6101240

相关文章