AJAX避免重複的代碼

我想使用AJAX對我的網站的許多功能，編輯標題，速度的文章，即時創建一個實體等

我的問題很簡單：

我需要創建一個jQuery函數爲每個functionnality，就像這樣：

$('#specific-functionality').bind('click', function(e){ 

    var element = $(this); 
    e.preventDefault(); 

    // the call 
    $.ajax({ 
     url: element.attr('href'), 
     cache: false, 
     dataType: 'json', 
     success: function(data){   

     // some custom stuff : remove a loader , show some value, change some css 

     } 
    }); 
    });

這聽起來非常沉重的我，所以我想知道如果JS端有任何框架，或者我可以用來避免這種情況的特定方法。我正在考慮根據響應類型（html_content，boolean，integer）對項目進行重組，但也許已經存在很好的處理它的東西！

來源

2012-11-02 Vincent Wasteels

相反的$('#specific-functionality').bind('click', function(e){，試試這個：

$(".ajax").click(function(){ 

    var url = $(this).attr("href") ; 
    var target = $(this).attr("data-target") ; 
    if (target=="undefined"){ 
     alert("You forgot the target"); 
     return false ; 
    } 

    $.ajax(....

，而在HTML

<a class="ajax" href="..." data-target="#some_id">click here </a>

我認爲這是最簡單的解決方案。如果你想通過ajax工作一些鏈接，只需給它類「ajax」，並把data-target放到應該輸出結果的地方。所有自定義的東西都可以放在這些data-something屬性中。

來源

2012-11-02 19:17:38 Zeljko

更好，謝謝！我正在查看StakOverflow的投票系統，它似乎在使用相同的概念！ –

從我的理解，你要求的JQuery ajax方法更輕的版本。有直接的get/post方法，而不是使用ajax。

$.get(element.attr('href'), {'id': '123'}, 
    function(data) { 
     alert(data); 
    } 
);

配置錯誤功能

$.get(element.attr('href'), {'id': '123'}, function(data) {alert(data);}) 
.error(function (XMLHttpRequest, textStatus, errorThrown) { 
         var msg = jQuery.parseJSON(XMLHttpRequest.responseText); 
         alert(msg.Message); 
});

此外，您還可以通過回調函數做任何同步操作一樣

function LoadData(cb) 
{ 
    $.get(element.attr('href'), { 'test': test }, cb); 
}

並調用

LoadData(function(data) { 
alert(data); 
otherstatements; 
});

對於進度條，您使用JQuery ajaxStart和ajaxStop函數而不是手動隱藏和顯示它。請注意，該頁面上的每個JQuery AJAX操作都會被觸發。

$('#progress') 
    .ajaxStart(function() { 
    //disable the submit button 
    $(this).show(); 
    }) 
    .ajaxStop(function() { 
    //enable the button 
    $(this).hide(); 
    });

來源

2012-11-02 16:56:03 Sunny

你給我看的非常有用的技巧！謝謝！！ –

AJAX避免重複的代碼

回答

相關問題