jquery中ajax常用方法

时间:2023-03-08 22:38:11
jquery中ajax常用方法

index.html:

 <h3>$.get(url, [data], [callback], [type])<br/>
$.post(url, [data], [callback], [type])
</h3> <p>以 GET|POST method 发送 ajax 请求<br/>
type: text|html|json|script
</p> <hr/>
<h3>$(selector).load(url, [data], [callback])</h3> <p>将页面片段载入到selector所代表的容器中</p>
<div style="border:1px dashed gray" id="container"> </div> <hr/>
<h3>$.getJSON(url, [data], [callback])<br/>
$.getScript(url, [callback])</h3> <p>加载json格式数据或脚本</p> <hr/>
<button class="btn btn-default btn-sm" onclick="test()"> TEST</button>

index.html 中的js:

    

 // 所有快捷API都有一个共同特点:
// 不能指定错误时的回调
// 同时,有错误时(http status 或者 type 不匹配等)都没有任何提示
function test() {
//get();
//post();
show();
//sendToTest();
//testWithData();
// testWithCallback();
// testWithDataAndCallback();
// testType();
//testGetScript();
// testGetJson();
// testLoad();
}
//data是请求返回的数据
function get(){
$.get("/test/sui.php", { name: "John", time: "2pm" },
function(data){
alert("Data Loaded: " + data);
}); }
//post方式是通过表单发送2个数据
function post()
{
$.post("/test/sui.php",{name : "suitenglong",age : '21'}, function(data){
alert("Data Loaded: " + data);
});
} //$(selector).load(url, [data], [callback])取出的内容放里面
function show()
{
$("#container").load('/test/sui.php');
}

服务器中的文件 sui.php:

  

 <?php 

 sui();
function sui()
{
echo "<p>你好啊</p>";
echo "<p>嘿嘿</p>";
} ?>