Skip to content

Instantly share code, notes, and snippets.

@ngyuki

ngyuki/deferred-example.html

Last active August 29, 2015 13:56
Show Gist options
  • Save ngyuki/9089435 to your computer and use it in GitHub Desktop.
Save ngyuki/9089435 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
deferred-example.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script>
$(function(){
$('#aaa').click(function(){
for (var i=0; i<3; i++) {
$.ajax({
url: '/?' + $.param({a:i}),
type: 'get',
async: false,
success: function(data){
console.log('a'+i);
$.ajax({
url: '/?' + $.param({b:i}),
type: 'get',
async: false,
success: function(data){
console.log('b'+i);
}
});
}
});
}
console.log("Requests complete!");
});
$('#bbb').click(function(){
var success = function(){
console.log("Requests complete!");
};
for (var i=2; i>=0; i--) {
(function(){
var x = i;
var s = success;
success = function(){
$.ajax({
url: '/?' + $.param({a:x}),
type: 'get',
async: true,
success: function(data){
console.log('a'+x);
$.ajax({
url: '/?' + $.param({b:x}),
type: 'get',
async: true,
success: function(){
console.log('b'+x);
s();
}
});
}
});
}
})();
}
success();
});
$('#ccc').click(function(){
var defer = $.Deferred().resolve();
for (var i=0; i<3; i++) {
(function(){
var x = i;
defer = defer
.then(function(){
return $.ajax({
url: '/?' + $.param({a:x}),
type: 'get',
async: true
})
})
.then(function (data) {
console.log('a'+x);
return $.ajax({
url: '/?' + $.param({b:x}),
type: 'get',
data: data
});
})
.then(function () {
console.log('b'+x);
})
;
})();
}
defer.then(function(){
console.log("Requests complete!");
});
});
});
</script>
</head>
<body>
<input type="button" id="aaa" value="同期">
<input type="button" id="bbb" value="非同期">
<input type="button" id="ccc" value="非同期(Deferred)">
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment