<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$.get("try/ajax/demo_test.txt",
function(data, status){
alert("数据: "+data+"\n状态: "+status);
});
});
$("#btn2").click(function(){
$.post("/try/ajax/demo_test.php",{
name:"菜鸟教程",
url:"http://www.runoob.com"
},
function(data, status){
alert("数据: \n"+data+"\n状态: "+status);
});
});
});
</script>
</head>
<!--
jQuery-AJAX get()和post()方法
jQuery get()和post()方法用于HTTP GET或POST请求从服务器请求数据
HTTP请求:GET vs. POST
两种在客户端和服务器端进行请求-响应的常用方法是:GET和POST
- GET-从指定的资源请求数据
- POST-向指定的资源提交要处理的数据
GET基本用于从服务器获得(取回)数据.注释:GET方法可能返回缓存数据
jQuery $.get()方法
$.get()方法通过HTTP GET请求从服务器上请求数据
语法
$.get(URL,callback);
必需的URL参数规定您希望请求的URL
可选的callback参数是请求成功之后执行的函数名
下面的例子使用$.get()方法从服务器上的一个中取回数据
$("#btn1").click(function(){
$.get("try/ajax/demo_test.txt",
function(data, status){
alert("数据: "+data+"\n状态: "+status);
});
});
$.get()的第一个参数是我们希望请求的URL("demo_test.txt").
第二个参数是回调函数.
第一个回调参数存有被请求页面的内容.第二个回调参数存在请求的状态
jQuery $.post()方法
$.post()方法通过HTTP POST请求向服务器提交数据
语法:
$.post(URL,data,callback);
必需的URL参数规定您希望请求的URL
可选的data参数规定连同请求发送的数据
可选的callback参数是请求成功后执行的函数名.
下面的例子使用$.post()连同请求一起发送数据
$("#btn2").click(function(){
$.post("/try/ajax/demo_test.php",{
name:"菜鸟教程",
url:"http://www.runoob.com"
},
function(data, status){
alert("数据: \n"+data+"\n状态: "+status);
});
});
$.post()的第一个参数是我们希望请求的URL("demo_test_post.php")
然后我们连同请求(name和url)一起发送数据
"demo_test_post.php"中的php脚本读取这些参数,对他们处理,然后返回结果
第三个参数是回调函数.第一个回调函数存有被请求页面的内容,而第二个参数存有请求的状态
-->
<body>
<button id="btn1">发送一个HTTP GET请求并返回结果</button>
<button id="btn2">发送一个HTTP POST请求页面并获取返回内容</button>
</body>
</html>