通用jQueryAjax插件?

通用jQueryAjax插件?,ajax,jquery,post,Ajax,Jquery,Post,我正在编写一个相当大的web应用程序,它包含一个公共和管理站点。我在使用大量jQuery和ajax时遇到了一些问题 谈到ajax,我发现自己重复了很多代码。例如,单击一个按钮可以导致3-4个单独的ajax调用。这些调用中的每一个都使用几乎相同的jQuery代码 我正在寻找一个插件或js/jQuery函数,它可以处理大多数(如果不是所有的话)ajax调用。这里有人知道这样的插件/功能吗?如果是,请告诉我 提前感谢您的回复 只需为常见操作创建一个全局单击处理程序,并在标记本身上包含请求的数据。比如说

我正在编写一个相当大的web应用程序,它包含一个公共和管理站点。我在使用大量jQuery和ajax时遇到了一些问题

谈到ajax,我发现自己重复了很多代码。例如,单击一个按钮可以导致3-4个单独的ajax调用。这些调用中的每一个都使用几乎相同的jQuery代码

我正在寻找一个插件或js/jQuery函数,它可以处理大多数(如果不是所有的话)ajax调用。这里有人知道这样的插件/功能吗?如果是,请告诉我


提前感谢您的回复

只需为常见操作创建一个全局单击处理程序,并在标记本身上包含请求的数据。比如说,

<a class="loadcontent" href="/page1.html", data-target="#content">Page 1</a>
<a class="loadcontent" href="/page2.html", data-target="#content">Page 2</a>
<a class="loadcontent" href="/page3.html", data-target="#content">Page 3</a>

... somewhere else...
<a class="loadcontent" href="/foo/bar/somepage.html", data-target="#sub-content">Some other page</a>
您可以以相同的方式使用更高级的操作进行类似的整合,从而允许您在应用程序的不同区域重复使用相同的事件处理程序

<a href="/delete.php" data-entity-type="Person" data-entity-id="7363" class="delete">Delete Person</a>

jquery承诺在ajax回调链接和提高代码重用性和可读性方面会有很大帮助。查看jquery文档了解更多信息(和)

下面是一个可能有助于解释的例子

        //-----------functions for rendering ajax responses
        function onError(){
           $("#errorMessage").text("opps!");
        }

        function displayInfo(data){
           $("#infoMessage").text(data);
        }

        function displayOtherInfo(data){
           $("#otherInfoMessage").text(data);
        }
        // ---------- end rendering functions ---------------


        //-----------functions for building ajax promises
        function getInfo(){
           buildAjaxPromise("InfoUrl", "data") //returns a promise that gets an ajax response from InfoUrl
             .done(displayInfo) //when the ajax completes call displayInfo
             .fail(onError);    //if something goes wrong call onError
        }

        function getOtherInfo(){
           buildAjaxPromise("OtherInfoUrl", "otherData")  //returns a promise that gets an ajax response from InfoOtherUrl
             .done(displayOtherInfo)  //when the ajax completes call displayInfo
             .fail(onError);          //if something goes wrong call onError
        }
        //-------------- end ajax promises -----------------

        //builds a jquery ajax promise
        function buildAjaxPromise(_url, _data){
           return $.ajax({ url: _url, data: _data, type:"GET", dataType:"json", contentType:"application/json; charset=utf-8"});
        }

        //start ajax calls
        getInfo();
        getOtherInfo();

你能展示一些代码吗?我被你在插件中寻找的东西弄糊涂了。你到底想让它做什么?“处理AJAX调用”是什么意思?jQuery速记
$.get
$.getJSON
$.post
,和
$().load
是否不够好?这是一种保持整洁和简单的好方法。
$(document).on("click","a.delete",function(e){
    e.preventDefault();
    if (confirm("Are you sure you wish to delete this record?") == false) return;
    var $this = $(this), $data = $this.data();
    $.post(this.href,{entityType: $data.entityType, entityId: $data.entityId},"json")
        .done(function(data){
            if (data.result == "success") {
                $this.closest($data.parentSelector).remove();
            }
        });
});
        //-----------functions for rendering ajax responses
        function onError(){
           $("#errorMessage").text("opps!");
        }

        function displayInfo(data){
           $("#infoMessage").text(data);
        }

        function displayOtherInfo(data){
           $("#otherInfoMessage").text(data);
        }
        // ---------- end rendering functions ---------------


        //-----------functions for building ajax promises
        function getInfo(){
           buildAjaxPromise("InfoUrl", "data") //returns a promise that gets an ajax response from InfoUrl
             .done(displayInfo) //when the ajax completes call displayInfo
             .fail(onError);    //if something goes wrong call onError
        }

        function getOtherInfo(){
           buildAjaxPromise("OtherInfoUrl", "otherData")  //returns a promise that gets an ajax response from InfoOtherUrl
             .done(displayOtherInfo)  //when the ajax completes call displayInfo
             .fail(onError);          //if something goes wrong call onError
        }
        //-------------- end ajax promises -----------------

        //builds a jquery ajax promise
        function buildAjaxPromise(_url, _data){
           return $.ajax({ url: _url, data: _data, type:"GET", dataType:"json", contentType:"application/json; charset=utf-8"});
        }

        //start ajax calls
        getInfo();
        getOtherInfo();