ajax发送请求的几种方式
以下几种方法的放回格式有:文本、xml、html、json
1.原生的方法:XMLHttpRequest
window.onload = function() { // 获取事件对象 var obj = document.getElementsByTagName("a")[0]; // 定义对象的行为 obj.onclick = function() { // 1. 创建一个XMLHttpRequest对象 var request = new XMLHttpRequest(); // 2. 准备发送的URL和方式 var url = this.href; var method = "GET"; // 3. 准备发送 request.open(method, url); // 4. 开始发送 request.send(null); // 5. 响应函数 request.onreadystatechange = function() { // 判断响应是否完成 if (request.readyState == 4) { // 判断响应是否正确 if (request.status == 200 || request.status == 304) { var responseText = request.responseText; alert(responseText); } } } // 取消对象的默认行为, 即: 点击之后停留在本页面不跳转 return false; } }
2.load方法,html对象.load(url, args);
<script type="text/javascript"> $(function() { $("a").click(function() { var url = this.href; // 加上args参数, 发送的就是post请求, 不加参数发的就是get请求, 注意: 参数的格式是json格式 var args = {"time": new Date()}; $("#content").load(url, args); return false; }); }); </script>
3.$.get(url, args, function(data) {})
$(function() { $("a").click(function() { var url = this.href; var args = {"time": new Date()}; $.get(url, args, function(data) { alert("用户名:" + data.username); }); return false; }); });
4.$.getJSON(url, args, function(data) {});
<script type="text/javascript"> $(function() { $("a").click(function() { var url = this.href; var args = {"time": new Date()}; $.getJSON(url, args, function(data) { alert("用户名:" + data.username); }); return false; }); }); </script> 或者: <script type="text/javascript"> $(function() { $("a").click(function() { var url = this.href; var args = {"time": new Date()}; $.get(url, args, function(data) { alert("用户名:000" + data.username); }, "JSON"); return false; }); }); </script>
5.$.post(url, args, function(data) {});
<script type="text/javascript"> $(function() { $(":input[name='username']").change(function() { var username = $(this).val().trim(); if (username != "") { var url = "validateUsername"; var args = {"username": username, "time": new Date()}; // 发送的数据 $.post(url, args, function(data) { $("#message").html(data); }); } }); }); </script>
6. $.get("url").done(function(){});
$.get('data.json').done(function (data) {});