3

我有三个 3 (jquery) 选项卡：

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

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

我应该使用加载事件来操作数据吗？如果是这样，如何在加载事件中获取返回的 json 数据的句柄？

4

2 回答 2

2

我对 jQuery UI 几乎没有经验，但我知道您可以从 AJAX 请求中获取 JSON 格式的数据（此处）：

$.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 返回的选项卡值。似乎选项卡 API 并不适合任何人自己处理显示过程。我看到了其他三个选项：自己重做选项卡 API；破解 API 来做你的事；或做类似的事情get_tab_contents.php?tabid=someid&json=somepath

于 2012-06-04T18:30:11.973 回答
1

也许我读错了，但是....您可以在 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;
}
于 2012-06-04T18:29:22.690 回答