Jquery添加页面加载显示请求的标签功能

jquery add on page load show requested tab feature

本文关键字：请求 标签 功能 显示 加载 添加 Jquery      更新时间：2023-09-26

我是jquery的新手，我已经使用了这个代码标签

<script type="text/javascript" charset="utf-8">
    $(function () {
        var tabContainers = $('div.tabs > div');
        tabContainers.hide().filter(':first').show();
        $('div.tabs ul.tabNavigation a').click(function () {
            tabContainers.hide();
            tabContainers.filter(this.hash).show();
            $('div.tabs ul.tabNavigation a').removeClass('selected');
            $(this).addClass('selected');
            return false;
        }).filter(':first').click();
    });

</script>

我需要的是能够加载一个特定的选项卡时打开一个url:www.mysite.com/page.html tab1

html链接如下:

<a href="#tab1" class="selected">name link</a>
<a href="#tab2" class="">name link2</a>
<a href="#tab3" class="">name link3</a>

我已经尝试了很多脚本，但也许是我的错(我是一个家伙与javascript)

提前感谢

JQuery-UI有一个选项卡小部件，你可以使用。

比自己写更简单，更稳定。

不同的网址请看看这篇文章。

它告诉你如何利用ui主题和加载不同的URl。

否则你必须在标签页

的点击事件中添加$('#theIdOfTheDiv').load(url)

  1. 你需要一个像<a href="#tab1">click to see tab1</a>这样的锚

  2. 你需要将用户重定向到#tab1，所以你必须删除函数的return false;行，它会禁用重定向

  3. 点击<a>时触发你的函数，你需要在加载页面时再次触发

你的函数看起来像这样

$(function(){
    onClickHandler = function() {
      $('div.tabs > div').hide();
      $(window.location.hash).show();
    }
    $('div.tabs ul.tabNavigation a').click(onClickHandler);
    onClickHandler();
});

您希望在默认情况下显示的选项卡应该在HTML中有一个selected类。相关的内容包装器也应该如此。

窗口。Location有一个散列属性。因此，你可以对照空字符串进行检查如果它不是空的，选择标签:

if(!window.location.hash === "")
    $(window.location.hash).show();
相关文章：