如何使用 jQuery UI 选项卡通过 ajax 加载外部 div

发布于 2024-11-16 09:16:41 字数 765 浏览 0 评论 0原文

我正在使用 Jquery UI 选项卡功能通过 ajax 加载内容。我想在 ajax 调用中加载特定的 div，而不是整个页面。不使用 jQuery 的 load() 是否可以实现？

正如您从代码中看到的，它是一个标准的基本 jQuery 选项卡实现，但我想要一个特定的 div 而不是整个页面。

这是我的 html：

<div id="tabs">
    <ul>
        <li><a href="tab-1">Tab One</a></li>
        <li><a href="tab-2">Tab Two</a></li>
        <li><a href="http://www.domain.com #target">Ajax tab</a></li>
    </ul>

    <div id="tab-1>Tab one content</div>
    <div id="tab-2>Tab two content</div>
</div>

和内联脚本：

<script>
    $(function() {
        $( "#tabs" ).tabs();    
    });
</script>

有人知道这是否可能吗？

原文

I'm using the Jquery UI tabs functionality to load content via ajax. I'd like to load a particular div in the ajax call, not the entire page. Is this possible without using jQuery's load()?

As you can see from the code, it's a stock standard basic jQuery tabs implementation, but I want a particular div rather than the full page.

Here's my html:

<div id="tabs">
    <ul>
        <li><a href="tab-1">Tab One</a></li>
        <li><a href="tab-2">Tab Two</a></li>
        <li><a href="http://www.domain.com #target">Ajax tab</a></li>
    </ul>

    <div id="tab-1>Tab one content</div>
    <div id="tab-2>Tab two content</div>
</div>

And the inline script:

<script>
    $(function() {
        $( "#tabs" ).tabs();    
    });
</script>

Anyone know if this is possible?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

萌化 2024-11-23 09:16:41

内森。

是的，这是可能的。使用 jQuery ajax“加载”功能。示例：

$('#result').load('ajax/test.html #container');

对于第三个选项卡，您应该通过 ajax 调用手动加载内容，您也可以定义选择器，您需要的是加载页面的哪一部分。因此，通过常规方式创建第三个选项卡，加载第三个选项卡的页面内容并创建选项卡。或者，您可以在用户单击选项卡时动态加载第三个选项卡的内容。

更多信息请参见：http://api.jquery.com/load/，请参阅“加载”段落页面碎片”。

Nathan.

Yes, it is possible. Use jQuery ajax "load" function. Example:

$('#result').load('ajax/test.html #container');

For your 3rd tab you should manually load content via ajax call, also you can define selector which exactly part of loaded page you need. So, create 3rd tab as via general way, load page content for 3rd tab and create tabs. Or you can dynamically load 3rd tab's content when the user clicks on tab.

More information here: http://api.jquery.com/load/, please see paragraph "Loading Page Fragments".

回复收藏 0 原文

~没有更多了~