码迷,mamicode.com
首页 > Web开发 > 详细

[js开源组件开发]network异步请求ajax的扩展

时间:2015-08-07 12:58:12      阅读:271      评论:0      收藏:0      [点我收藏+]

标签:

network异步请求ajax的扩展

在日常的应用中,你可能直接调用$.ajax是会有些问题的,比如说用户的重复点击,比如说我只希望它成功提交一次后就不能再提交,比如说我希望有个正在提交的loading效果。所以我做network这个组件来扩展$.ajax,希望全中国的人民们喜欢。

这里使用到了上篇[js开源组件开发]loading加载效果 一个loading效果,但为了让它独立运行,所以没有进行引用,而是直接做了一个loading方法在里面。它的具体效果图如下:

技术分享

它的实例DEMO地址请点击这里http://www.lovewebgames.com/jsmodule/network.html

network的github源码托管在这里https://github.com/tianxiangbing/network

 

API

ajax:({},target)

    ajax调用,settings同jquery的ajax,但多了一个oneRequest参数,此参数有时,会标识该请求只能成功发送一次,判断成功的标准是oneRequest返回true.
    target当传入此参数时loading将在target上loading,如果不传,加载效果就是全屏的。

 


$(#btn-send).click(function() {
    Network.ajax({
        url: "/ajax.json",
        data: "a=1",
        beforeSend: function() {
            console.log(发起请求)
        },
        oneRequest:function(result){
            if(result.status){
                return true;
            }else{
                return false;
            }
        }
    },this).done(function() {
        console.log(请求结束)
    });
});

 

get:(url,data,fun,dataType)

同jquery的get方法,以get方式的ajax请求,这里没有target,为全屏加载效果

 

post:(url,data,fun,dataType)

同$.post,以post方式的ajax请求,也是全屏的加载效果

 

[js开源组件开发]network异步请求ajax的扩展

标签:

原文地址:http://www.cnblogs.com/tianxiangbing/p/network.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!