多个内容与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加载

回答

相关问题