使用AJAX加載投資組合項目，無需重新加載頁面

我有一堆投資組合項目排序爲此頁面上的選項卡。 Link to the site。該網站是用Joomla 2.5構建的，我有一個組件負責顯示每個投資組合項目。我需要做的是加載每個相應的投資組合項目，而無需重新加載頁面。所以基本上這裏是具有AJAX調用使用AJAX加載投資組合項目，無需重新加載頁面

function ajax_portfolio($pid) { 
var url = 'index.php?option=com_jms_portfolio&task=item.ajax_load_portfolio&tmpl=component&id=' + $pid; 
alert(url); 
var x = new Request({ 
    url: url, 
    method: 'post', 
    evalScripts: true, 
    evalResponse: true, 
    onSuccess: function(responseText){ 
     document.getElementById('ja-content-main').innerHTML = responseText; 
     aaa(); 
    } 

    }).send();}

其實這個問題是不是AJAX調用的原因和標籤的單擊事件的JavaScript功能，沒有與此事件沒有任何問題。問題是在每個Ajax調用之後觸發javascript函數aaaa（）。對不起，如果我不清楚，但問題是每個Ajax調用後觸發函數aaa（），此函數爲每個投資組合項目創建滑塊。

來源

2012-05-04 digitup

刪除包裝圖像的<a>標籤的現有href屬性。然後，通過javascript將click處理程序添加到每個<a>標記中，然後向它們提供一個unqiue標識。這會導致在點擊圖像時調用ajax，而不是重定向到新頁面。

至於調用aaa函數，我認爲問題是範圍，因爲你沒有發佈的方法。爲了給aaa正確的範圍，你可以傳遞一個額外的參數給ajax_portfolio來實現這個。

A JQuery示例如下。

<a port_id="56"><img>...</img></a> 

$(document).ready(function() { 
    $("a").click(function() { 
    ajax_portfolio($(this).attr("port_id"), $(this)); 
    }); 
}); 

// Add the $elem parameter here to track which element called this method.  
function ajax_portfolio($pid, $elem) { 
    var url = ...; 
    var x = new Request({ 
    url: url, 
    method: 'post', 
    evalScripts: true, 
    evalResponse: true, 
    onSuccess: function(responseText){ 
     document.getElementById('ja-content-main').innerHTML = responseText; 
     // Pass the element that was clicked on to the aaa function. 
     aaa($elem); 
    } 
}).send();}

來源

2012-05-04 14:55:23

Eugh。不要這樣做。請遵循最佳做法：http://en.wikipedia.org/wiki/Unobtrusive_JavaScript – Quentin

@Quentin我試圖給出最簡單的解決方案。但是，您應該給出正確的解決方案而不是最簡單的解決方案。我已經更新了我的答案。如果您有更好的解決方案的建議，請添加任何評論。謝謝。 –

@BrantOlsen：非常感謝。問題實際上不是AJAX通話原因和標記的點擊事件，這個事件沒有問題。問題是在每個Ajax調用之後觸發javascript函數aaaa（）。對不起，如果我不清楚。 – digitup

使用AJAX加載投資組合項目，無需重新加載頁面

回答

相關問題