具有 Ajax 和静态 div 的 jQuery 选项卡

发布于 2024-07-29 01:47:43 字数 1055 浏览 5 评论 0原文

我正在将表单数据发布到使用 jQuery 选项卡的页面。因为您无法将发布数据加载到 Ajax 查询中（至少不需要大量额外工作并使其更加不安全），所以我将活动选项卡作为页面上的实际 div 加载。

<script type="text/javascript">
    $(document).ready(function () {
        $('#tabs').tabs({ selected: 3 });
    });
</script>

<div id="tabs" style="margin-top: 10px">
    <ul>
        <li><a href="myprofile.php">My Profile</a></li>
        <li><a href="mycompany.php">My Company</a></li>
        <li><a href="manageusers.php">Manage Users</a></li>
        <li><a href="#manageallusers">Manage All Users</a></li>
        <li><a href="manageclients.php">Manage Clients</a></li>
    </ul>
    <div id="manageallusers"></div>
</div>

在上面的示例中，除了“管理所有用户”选项卡之外的所有选项卡都是通过 jQuery 选项卡函数中的 Ajax 方法调用的。另一个只是页面上已有的静态 div。在初始加载时，这工作得很好。但是，如果您开始单击 Ajax 选项卡，静态 div 仍位于下方。

tabs() 函数中有一个“load:”回调。我知道我应该使用这个——我只是完全不确定如何处理它。有什么想法、建议吗？？

原文

I am posting form data to a page that is using jQuery tabs. Because you can't load post data into an Ajax query (at least without a ton of extra work and making it more insecure), I'm loading the active tab as an actual div on the page.

<script type="text/javascript">
    $(document).ready(function () {
        $('#tabs').tabs({ selected: 3 });
    });
</script>

<div id="tabs" style="margin-top: 10px">
    <ul>
        <li><a href="myprofile.php">My Profile</a></li>
        <li><a href="mycompany.php">My Company</a></li>
        <li><a href="manageusers.php">Manage Users</a></li>
        <li><a href="#manageallusers">Manage All Users</a></li>
        <li><a href="manageclients.php">Manage Clients</a></li>
    </ul>
    <div id="manageallusers"></div>
</div>

In the example above, all tabs except the "Manage All Users" tab is called via the Ajax method in the jQuery tabs function. The other is just a static div already on the page. On initial load, this works beautifully. However, if you begin to click through the Ajax tabs, the static div remains beneath.

There is a 'load:' callback in the tabs() function. I know I should be using this -- I'm just not sure at all how to approach it. Any thoughts, suggestions??

分享到QQ

分享到微博

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

发布评论

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

会傲 2024-08-05 01:47:43

$("#tabs").tabs(
        {
            load: function(ui)
            {
                $("#manageallusers").hide();
            }
        });

如果您试图隐藏它，这就是您会使用的。显然，您可以将其替换为您想做的任何事情，因为您对此并不是很具体。

$("#tabs").tabs(
        {
            load: function(ui)
            {
                $("#manageallusers").hide();
            }
        });

This is what you would use if you were trying to hide it. You could obviously swap it out with whatever you want to do, because you weren't very specific about it.

回复收藏 0 原文

~没有更多了~