如何处理每个jquery选项卡的不同json数据？

Question

我有三个3（jquery的）选项卡：

• 概述
• 定价
• 目的地信息

每个选项卡都具有完全不同的数据。我可以在href中指定一个URL来进行AJAX调用。但是，如何处理为每个选项卡收到的数据（以便我可以根据上下文渲染它们）？

我应该使用load事件来处理数据吗？如果是这样，我怎样才能得到在加载事件返回的json数据的句柄？

Answer 1

我有jQuery UI的经验不多，但我知道你可以从一个AJAX请求的JSON（here）获取数据：

$.ajax({ 
    url: "http://example.com/page.html", 
    dataType: "json", 
}).done(function (data) { 
    // Do some stuff with the data 
}); 

或者你可以使用jQuery.getJSON。 然后总是有jQuery.parseJSON。

编辑：至于我能弄清楚，这是最好的，你会得到：

$(window).load(function(){ 
    $(function() { 
     $("#tabs").tabs({ 
      ajaxOptions: { 
       error: function(xhr, status, index, anchor) { 
        $(anchor.hash).html(
         "Couldn't load this tab. We'll try to fix this as soon as possible. " + 
         "If this wouldn't be a demo."); 
       }, 
       success: function(jsonObject, status) { 
         // Code 
       }, 
       dataType: "json" 
      } 
     }); 
    }); 
}); 

这样，JSON需要包括你一起工作的标签。这会导致一个相当不雅的解决方案，因为你将不得不打开从json返回的tab值。看起来好像Tab API并不适合任何人自己处理显示过程。我看到其他三个选项：自己重做Tab API;破解API来做你的事情;或不喜欢get_tab_contents.php?tabid=someid&json=somepath

Answer 2

也许我在阅读这个错误，但是......你可以在你的AJAX响应中使用带有某种标记的开关。

/* 
    Your AJAX response could be something like: 
    data.type = destination, overview, pricing etc 
    data.content = The actual content you are expecting 
*/ 
var data=/* Your ajax call */ 
switch(data.type) 
{ 
case 'destination': 
     /* Handle the rest of the data object*/ 
     $('div').html(data.content); 
     break; 
case 'overview': 
     break; 
case 'pricing': 
     break; 
}