如何从jQuery UI选项卡中打开链接INSIDE表示选项卡

首先，我已经看过这个问题 ，这不是同一个问题。

最后，我试图允许链接打开的选项卡，该选项卡一旦点击就会获取相应的URL并在原始选项卡式空间的内容中显示该URL （但在后台保留原始选项卡） 。

例如：

我有3个标签：

1. 管理员（admin.php）
2. 成员（members.php）
3. 统计数据（stats.php）

当我打开“成员”选项卡时，还有2个附加链接：

1. 添加会员（add.php）
2. 删除成员（delete.php）

无论我选择单击其中一个， add.php或delete.php的内容delete.php显示在与其父级（members.php）相同的选项卡式空间中

我遇到了jquery文档，但似乎没有正确访问。

目前，我的jquery代码是：

  $(function() { $( "#tabs" ).tabs({ spinner: '', select: function(event, ui) { var tabID = "#ui-tabs-" + (ui.index + 1); $(tabID).html("Fetching Data.... Please wait...."); }, cache:false, load: function(event, ui) { $('a', ui.panel).click(function() { $(ui.panel).load(this.href); return false; }); }, ajaxOptions: { error: function( xhr, status, index, anchor ) { $( anchor.hash ).html( "Error: Could not retrieve information." ); } } });  

编辑

我添加了一个jsbin文件来显示标签格式。

http://jsbin.com/apidi6/edit

我希望基本上能够在第一个选项卡中单击ebay.com链接，并在“常规信息”选项卡的内容中加载完整的html页面（无页面重定向）

Answer 1

如果我理解正确，这应该做你想要的，但你需要稍微改变你的代码：

 $('a.tabLink').click(function(e) { e.preventDefault(); var href = $(this).attr('href'); var page = ''; var id = $(this).closest("div").attr("id"); $('#'+id).html(page); }); 

您需要确保选项卡中的任何链接都添加了一个类：

现在发生的是，您单击类tabLink的链接，jQuery阻止浏览器跟踪链接。 它抓取链接的地址。 它构建一个iframe来容纳页面。 它获取链接所在的div的ID ，然后用iframe替换div内容。

看到它在这里工作

使用iframe的原因是javascript不允许您从其他域加载数据，只要您的链接在同一个域中，您的ajax请求应该能够加载页面，我发布的代码将允许您加载外部页面。

运行代码时会出现什么错误？