多個內容與Ajax/JSON加載

我已經實現了使用Ajax的外部內容加載。現在我想使用我擁有的Json對象代碼添加多個容器加載功能。多個內容與Ajax/JSON加載

你能幫我把json對象代碼合併到Ajax代碼中嗎？我在編碼的知識是非常有限的:)

以下是詳細信息：

這裏是JSON對象：

var json = [{'id': 'content', 'wrapper': '__content-wrapper'},{'id': 'content', 'wrapper': '__content-wrapper'}] 

$.each(json, function(i, itm) { 
$('#'+itm.id).wrap('<div id="' + itm.wrapper + '"></div>'); 
pageload(itm.id, itm.wrapper); 
} 

function pageload (id, wrapper) { 

}

下面是Ajax代碼：

$(document).ready(function() { 

    var contentWrapID = '___content-wrapper'; 

    $('#content').wrap('<div id="' + contentWrapID + '"></div>'); 

    function showNewContent() { 
     $("#" + contentWrapID).slideDown(); 
     $('#load').fadeOut(); 
    } 

    function pageload(hash) { 
     if(hash) { 
      $("#" + contentWrapID).load(hash + " #content",'',function(){ 
       if($('img:last',this).get(0)) { 
        $('img:last',this).load(function(){ 
         showNewContent(); 
        }); 
       } else { 
        showNewContent(); 
       } 

      }); 
     } else { 
      $("#" + contentWrapID).load("index.html #content"); 
     } 
    } 
    $.historyInit(pageload); 

    $('#topnav li a').click(function(){ 

     var hash = $(this).attr('href'); 
     hash = hash.replace(/^.*#/, ''); 
     $("#" + contentWrapID).slideUp(300,function(){ 
      $.historyLoad(hash); 
     }); 
     if(!$('#load').get(0)) { 
      $('#container').append('<span id="load">LOADING...</span>'); 
     } 
     $('#load').fadeIn('normal'); 
            $('#topnav li a').removeClass('current'); 
            $(this).addClass('current'); 
     return false; 



    }); 

});

。 .......................

據我所知，我必須更換這一行：

var contentWrapID ='___ content-wrapper';

與JSON對象：

變種JSON = [{ 'ID'： '內容'， '包裝'： '__content-包裝'}，{ 'ID'： '內容2'， '包裝'： '__content-wrapper2'}];

但我也必須改變頁面加載的功能，使其與所傳遞的新變量的工作原理：

功能頁面加載（ID，包裝）{

}

我還我想特別說明這一點：

爲了能夠從html頁面中相應的#div中提取內容，（我們稱之爲#div 1）（讓我們稱之爲featured.html），並點擊第一個導航菜單中的任何選項卡（可以稱之爲#topnav）。
爲了能夠從另一個html頁面中的相應#div中提取內容（讓我們稱之爲#div 2），點擊第二個導航欄中的任意選項卡（讓我們稱之爲news.html）菜單，（讓我們叫它＃vertnav-bar）。

P.S每次點擊只有一個div被加載。（從你解釋的內容來看，我認爲這個特別的細節很重要，我提到關於頁面載入調用函數，換句話說，沒有人給出時間點將數據加載到多於一個#div

I倒是對於任何幫助，非常感謝

問候保羅

來源

2010-01-27 thrtst

如果我理解正確的話，你需要的東西，將採取JSON數據taht已加載通過Ajax調用，並把這個JSON對象到一些HTML 。也許你應該看看http://code.google.com/p/jquery-load-json/ JQuery插件，它可以讓你將json對象加載到任何html元素中

$("#div1").loadJSON(jsonObject);

其中'div1'是您的元素的id，jsonObject是您已經加載的JSON對象。在插件網站上有幾個例子可以幫助你，例如http://jquery-load-json.googlecode.com/svn/trunk/categories-ajax.html，它顯示瞭如何將json對象與類別一起加載並將它們加載到下拉列表中。每次父類別更改時，子將被重新加載。它看起來像你的例子簡化的情況。

Jovan

來源

2011-09-30 16:29:58

多個內容與Ajax/JSON加載

回答

相關問題