Jquery $when done then的用法详解
对于$.ajax请求来说，如果层级比较多，程序看起来会比较乱，而为了解决这种问题，才有了$when...done...fail...then的封装，它将$.ajax这嵌套结构转成了顺序平行的结果，向下面的$.ajax写法，看起来很乱
$.ajax({
url:"/home/GetProduct",
dataType:"JSON",
type:"GET",
success:function(data){
$.ajax({
url:"/home/GetProduct",
dataType:"JSON",
type:"GET",
success:function(data){
$.ajax({
url:"/home/GetProduct",
dataType:"JSON",
type:"GET",
success:function(data){
}
}
}
而它实现的功能无非就是外层执行完成后，去执行内层的代码代码，看下面的$.when写法，就清晰多了
$.when($.ajax({
url:"/home/GetProduct",
dataType:"JSON",
type:"GET",
success:function(data){
alert(JSON.stringify(data));
}
})).done(function(data){
alert(data[0].Name);
}).done(function(data){
alert(data[1].Name);
}).fail(function(){
alert("程序出现错误！");
}).then(function(data){
alert("程序执行完成");
});
而对于这种ajax的封装，在比较流行的node.js里也需要被看到，这就类似于方法的回调技术！
在使用ＭＶＶＭ的KO上，更加得心应手，感觉$.when就是为了Knockoutjs而产生的！
//ＭＶＶＭ数据绑定
varMyModel=newmodel();
$.when($.ajax({
url:"/home/GetProduct",
dataType:"JSON",
type:"GET",
success:function(data){
MyModel.PeopleList=ko.observableArray(data);//先为对象赋值
}
})).done(function(data){
ko.applyBindings(MyModel);//再绑定对象
});
以后我们在进行前端开发时，应该多使用这种顺序的，平行的代码段，而少用嵌套的代码段，这只是大叔个人的见解。
下面通过一个例子再给大家介绍jquerywhenthen(done)用法
//运行条件jquery1.82以上，直接运行代码，看结果
varlog=function(msg){
window.console&&console.log(msg)
}
functionasyncThing1(){
vardfd=$.Deferred();
setTimeout(function(){
log('asyncThing1seemstobedone...');
dfd.resolve('1111');
},1000);
returndfd.promise();
}
functionasyncThing2(){
vardfd=$.Deferred();
setTimeout(function(){
log('asyncThing2seemstobedone...');
dfd.resolve('222');
},1500);
returndfd.promise();
}
functionasyncThing3(){
vardfd=$.Deferred();
setTimeout(function(){
log('asyncThing3seemstobedone...');
dfd.resolve('333');
},2000);
returndfd.promise();
}
/*doit*/
$.when(asyncThing1(),asyncThing2(),asyncThing3()).done(function(res1,res2,res3){
log('alldone!');
log(res1+','+res2+','+res3);
})
以上所述是小编给大家介绍的Jquery$whendonethen的用法详解，希望对大家有所帮助，如果大家对此还有疑问欢迎给我留言，小编会及时回复大家的，在此也非常感谢大家对毛票票网站的支持！