Question

这似乎是一个显而易见的能力，但我完全无法弄清楚如何去做。我有一系列像这样的链接

<a onclick="func('AS');" href="#">Asia</a>
<a onclick="func('AU');" href="#">Australia</a>
<a onclick="func('NA');" href="#">North America</a>

func函数执行大量数据准备，然后发出ajax请求。 ajax请求的结果将转换为迷你图。看起来有点像

"func": function(continent) {
    $.ajax({
        url     : "path/to/data.json",
        type    : "GET",
        data    : {"continent": continent},
        dataType: "jsonp",
        error   : function() { alert("Error loading html document"); },
        success : function(result) {       
            var html = "<table>" + 
                        "<tr><td colspan='2'><div id='a'></div></td></tr>" + 
                        "<tr><td colspan='2'><div id='b'></div></td></tr>" + 
                        "</table>";

            $("#a").sparkline(result.a);
            $("#b").sparkline(result.b);
        }
    });

}

这一切都很有效，除了我想在fancybox弹出窗口中显示html表格，我无法弄清楚如何连接它。我猜我必须反转这样的操作 - 将fancybox触发器绑定到与大陆代码的链接，将大陆代码传递给fancybox启动器，并用fjbox调用结果填充fancybox。总而言之，我该如何做到这一点？

更新：实际上，以下工作

"func": function(continent) {
    $.ajax({
        url     : "path/to/data.json",
        type    : "GET",
        data    : {"continent": continent},
        dataType: "jsonp",
        error   : function() { alert("Error loading html document"); },
        success : function(result) {       
            var html = "<table>" + 
                        "<tr><td colspan='2'><div id='a'></div></td></tr>" + 
                        "<tr><td colspan='2'><div id='b'></div></td></tr>" + 
                        "</table>";

            $.fancybox({
                content: html,
                autoDimensions: true
            });

            $("#a").sparkline(result.a);
            $("#b").sparkline(result.b);
        }
    });

}

Answer 1

这些方面的东西？

success : function(result) {       
            var html = "<table>" + 
                        "<tr><td colspan='2'><div id='a'></div></td></tr>" + 
                        "<tr><td colspan='2'><div id='b'></div></td></tr>" + 
                        "</table>";

            $("#a").sparkline(result.a);
            $("#b").sparkline(result.b);

            // Pass table to fancybox
            $.fancybox(html);
        }

将ajax函数的结果放在fancybox 1.3.4中

1 个答案: