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

Question

我有一堆投資組合項目在此頁面上按選項卡排序。 鏈接到該站點 。 該網站是用Joomla 2.5構建的，我有一個組件來顯示每個投資組合項目。 我需要做的是加載每個投資組合項目，而無需重新加載頁面。 所以基本上這里是具有AJAX調用的javascript函數

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調用原因和代碼的click事件，此事件沒有問題。 問題是在每個ajax調用之后觸發javascript函數aaaaa（）。 抱歉，如果我不清楚，但問題是在每個ajax調用后都會觸發函數aaa（），此函數將為每個投資組合項目創建一個滑塊。

Answer 1

刪除包裝圖像的<a>標記的現有href屬性。 然后，在為它們賦予一個非正常ID后，通過javascript將click處理程序添加到每個<a>標記中。 然后，這將導致在單擊圖像時調用ajax，而不是重定向到新頁面。

至於調用aaa函數，我認為問題是范圍，因為您尚未發布該方法。 為了給aaa正確的范圍，您可以將一個額外的參數傳遞給ajax_portfolio來完成此操作。

下面是一個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();}