jquery-ui 选项卡 - 添加选项卡

Question

我有一个显示在一个选项卡中的项目列表，我希望能够单击其中一个项目并打开一个新选项卡并在新选项卡上显示其详细信息。我正在通过执行以下操作添加新选项卡：

$(".btn-opener").click(function(){

$('#tabs').tabs('add', 'http://localhost/GetItem/' + $(this).attr('href'), "View Details");

}

我的问题是 url 实际上是一个返回 JSON 的服务端点。我希望能够将 js 模板应用于返回的数据。我该怎么做呢？我需要挂钩标签的加载事件吗？

Answer 1

我想我将通过在标签容器中添加一个带有我需要的 HTML 的 div 来解决这个问题，然后使用它的 id 来设置新标签的片段。例如：

$('.btn-opener').click(function () {

    var $this = $(this),
        itemID = $this.data("item-id");

            $.get("http://localhost/GetItem/" + itemID,

                function (data, textStatus, jqXHR) {

                    var html = Mustache.to_html($("#item-template").html(), data);                          

                    $("#tabs").append('<div id="' + id + '">' + html + '</div>');
                    $('#tabs').tabs("add", "#" + id, $this.text());

                },  
                "json"
            );

            return false;
        });

在将此标记为答案之前，我将等待看看是否有人提出了更好的解决方案。