Skip to content

Instantly share code, notes, and snippets.

@lionhylra
Created September 26, 2013 12:05
Show Gist options
  • Save lionhylra/6713231 to your computer and use it in GitHub Desktop.
Save lionhylra/6713231 to your computer and use it in GitHub Desktop.
===AJAX===
$.ajaxSetup({
});
var jqxhr = $.ajax({
url: "http://fiddle.jshell.net/favicon.png",
type:"GET",//or "POST"
data:{name:"Jimy",age:22},//or data:"aSTring",
contentType:"application/x-www-form-urlencoded; charset=UTF-8",
//When sending data to the server, use this content type.
dataType:"xml",
//The type of data that you're expecting back from the server.
//default: Intelligent Guess (xml, json, script, or html)
//"xml","html",script","json","jsonp","text"
beforeSend: function(jqXHR, settings) {//(jqXHR jqXHR, PlainObject settings)
jqXHR.overrideMimeType( "text/plain; charset=x-user-defined" );
//return false;//this will cancel request
},
success: function(data,textStatus,jqXHR){
// (PlainObject data, String textStatus, jqXHR jqXHR)
//first parameter is the data returned from server
//load returned data to page
$('#target').html(data);
},
complete: function(jqXHR, textStatus){
//(jqXHR jqXHR, String textStatus)
//do something...
//this setting is the same as .always()
//the possible value of textStatus:"success", "notmodified", "error", "timeout", "abort", or "parsererror"
},
global:true,
//Whether to trigger global Ajax event handlers for this request.default: true
context: document.body,
//Specifies the "this" value for all AJAX related callback functions
crossDomain:false,
//default: false for same-domain requests, true for cross-domain requests
username:"aString",
password:"aString",
statusCode:{
404:function(){
alert("page not found");
}
},
timeout:3000,//(in milliseconds)
cache:true
})
.done(function() {
alert( "success" );
})
.done(function() {
alert( "second success" );
})
.fail(function() {
alert( "error" );
})
.always(function() {
alert( "complete" );
});
// Set another completion function for the request above
jqxhr.always(function() {
alert( "second complete" );
});
$.ajaxSetup ({
cache: false
});
var loading = "<img src='img/load.gif' alt='loading...' />";
// load() functions
//1
var loadUrl = "ajax/load.php";
$("#load_basic").click(function(){
$("#result").html(loading).load(loadUrl);
});
//2.Load Part of the Remote File
$("#load_dom").click(function(){
$("#result")
.html(loading)
.load(loadUrl + " #picture"); //only load the content with id #picture
});
//3.Pass Parameters Through the GET Method
$("#load_get").click(function(){
$("#result")
.html(loading)
.load(loadUrl, "language=php&version=5"); //load through get methord
//By passing a string as the second param of load(),
//these parameters are passed to the remote url in the GET method.
});
//4.Pass Parameters Through the POST Method
$("#load_post").click(function(){
$("#result")
.html(loading)
.load(loadUrl, {language: "php", version: 5});
});
//5.load call back
$("#load_callback").click(function(){
$("#result")
.html(loading)
.load(loadUrl, null, function(responseText,textStatus,XMLHttpRequest){
alert("Response:\n" + responseText);
});
});
// $.get()
$("#get").click(function(){
$("#result").html(loading);
$.get(
loadUrl,
{language: "php", version: 5},
function(responseText){
$("#result").html(responseText);
},
"html"
);
});
// $.post()
$("#post").click(function(){
$("#result").html(loading);
$.post(
loadUrl,
{language: "php", version: 5},
function(responseText){
$("#result").html(responseText);
},
"html"
);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment