JQ获取AJAX控件

最新推荐文章于 2022-11-09 17:21:38 发布

GreenHand2333

最新推荐文章于 2022-11-09 17:21:38 发布

阅读量358

点赞数

分类专栏： AJAX

AJAX 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>

<html>

<head>

</script>

<!--

当 DOM（文档对象模型）已经加载，并且页面（包括图像）已经完全呈现时，会发生 ready 事件。

由于该事件在文档就绪后发生，因此把所有其他的 jQuery 事件和函数置于该事件中是非常好的做法。

选择器选择id=“btn1”的按钮，给点击设置事件：设置id=“test”的h3，使用ajax的load方法

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

-->
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$('#test').load('/example/jquery/demo_test.txt');
})
})
</script>
</head>

<body>

<h3 id="test">请点击下面的按钮，通过 jQuery AJAX 改变这段文本。</h3>
<button id="btn1" type="button">获得外部的内容</button>

</body>

</html>

这是示例文件（"demo_test.txt"）的内容：

 
   < 
   h2 
   > 
   jQuery AJAX 是个非常棒的功能！ 
   </ 
   h2 
   > 
  

 
    
   < 
   p 
    
   id 
   = 
   " 
   p1 
   " 
   > 
   这是段落的一些文本。 
   </ 
   p> 
  

 也可以把 jQuery 选择器添加到 URL 参数。
 下面的例子把 "demo_test.txt" 文件中 id="p1" 的元素的内容，加载到指定的 <div> 元素中：
 $("#div1").load("demo_test.txt #p1");
 
 可选的 callback 参数规定当 load() 方法完成后所要允许的回调函数。回调函数可以设置不同的参数：
 responseTxt - 包含调用成功时的结果内容
 statusTXT - 包含调用的状态
 xhr - 包含 XMLHttpRequest 对象
 下面的例子会在 load() 方法完成后显示一个提示框。如果 load() 方法已成功，则显示"外部内容加载成功！"，而如果失败，则显示错误消息：

  $("button").click(function(){ $("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){if(statusTxt=="success")alert("外部内容加载成功!");if(statusTxt=="error")alert("Error:"+xhr.status+":"+xhr.statusText);});});
 
 具体可以去w3c 或者菜鸟教程 都有说明