如何根据页面 url 显示或隐藏选项卡

2024-01-15

这是我的代码,用于翻转选项卡和选项卡下的内容:

$(function () {
    $('#tabs li a').click(function (e) {
        e.preventDefault();
        $('#tabs li, #content .current').removeClass('current');
        $(this).parent().addClass('current');
        var currentTab = $(this).attr('href');
        $(currentTab).addClass('current');
    });
});

我有以下代码可以确定用户位于网站的哪个部分:

$(window).load(function () {
    var homeTab = ["home1", "home2", "home3", "home4", "home5"];
    var recruitingTab = ["rec1", "rec2", "rec3", "rec4", "rec5"];
    var adminTab = ["adm1", "adm2", "adm3", "adm4"];

    var pathName = getPageName(window.location.pathname);
    alert(pathName);

    if ($.inArray(pathName, homeTab) != -1) {
        alert("at home tab");
    }
    if ($.inArray(pathName, recruitingTab) != -1) {
        alert("at recruiting tab");
    }
    if ($.inArray(pathName, adminTab) != -1) {
        alert("at admin tab");
        $("#tab li#tHome").removeClass('current');
        $("#tab li#tRecruiting").removeClass('current');
        $("#tab li#tAdminControls").addClass('current');
    }
});

如何将原始代码添加到 document.ready 函数中以实现上述功能?

编辑:我更新了上面的代码以查看它是否有效,但它不起作用。 :/


使用位置哈希要容易得多:

http://__someurl__#menustate

然后,您可以将路径与菜单状态分离,这样您就不再需要跟踪哪个路径转换为哪个菜单状态。

var menustate = document.location.hash;
$('.' + menustate).addClass('active');

然后你可以使用你想要的任何网址:

www.mysite.com/somepage#recruiting

然后,您可以检查加载时的哈希值,也可以更改它,并使其在单个页面中可添加书签。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何根据页面 url 显示或隐藏选项卡 的相关文章

随机推荐

  • 将表数据保存到 HTML5 LocalStorage

    我创建了一个 JSFiddleHere http jsfiddle net sethe23 j44tyjg6 我想做的是从以下代码保存表数据 save click function dataTable find tbody append t
  • 动态设置自定义AlertDialog内容

    我有一个自定义对话框 我将其设置为函数 public void customDialog Bitmap bm String title TextView dialogtext TextView findViewById R id layou
  • 在 ELKI 中运行聚类算法

    我需要以编程方式使用 ELKI 运行 k medoids 聚类算法 我有一个相似度矩阵 我希望将其输入到算法中 是否有任何代码片段可用于如何运行 ELKI 算法 我基本上需要知道如何创建Database and Relation对象 创建自
  • Qt4 自定义窗口框架像 Office 2007 中的那样吗?

    有没有办法强制 Qt4 绘制类似于 Office 2007 2010 的窗框 我希望我的应用程序在所有 Windows 版本中看起来都一样 而不仅仅是 vista 7 也许 QMainWindow 有一些扩展 感谢帮助 您必须删除标题栏并自
  • ScrollView 或其父级没有用

  • HTML 中的相对路径

    我正在创建一个网站localhost 我想将我网站中的所有链接资源设置为相对路径 我的意思是仅内部资源 网站位于 http localhost mywebsite 我读了这个有用的问题绝对 URL 与相对 URL https stackov
  • 避免静态方法过度使用的技巧

    我正在重构一些代码 并且正在查看一个名为 HFile 的类 HFile 具有所有私有构造函数 因此您无法实际创建它的实例 而不是创建 HFile 实例 如下所示 var file new HFile filename file Save 所
  • Androidmonkeyrunner的help.py在哪里

    我只是找不到help py文件以便创建 API 参考monkeyrunner 该命令描述于安卓参考 http developer android com guide developing tools monkeyrunner concept
  • 使用闪亮的文本输入和 dplyr 来过滤数据框中的行

    我正在尝试使用闪亮的应用程序上的文本输入小部件来过滤数据框中的行 但我无法让它工作 Dataset df1 lt data frame Name c Carlos Pete Carlos Carlos Carlos Pete Pete Pe
  • UITextView shouldChangeTextInRange 委托未调用

    我正在使用此代码来设置我视图中的 uitextview 的参数 textview UITextView alloc init textview setUserInteractionEnabled FALSE textview text Wr
  • 如何在powershell中仅显示用户所属组的组名

    所以我有以下脚本 但它列出了 AD 组的全名 例如 CN GroupName OU OUName DC DomainName DC com 如何仅指定组的名称 以便它仅列出名称本身 之后的部分CN 我试过 group Name但没有这样的运
  • “此 SqlTransaction 已完成;它不再可用。”...配置错误?

    我已经为此工作了大约一天半的时间 并在网络上搜索了大量博客和帮助文章 我发现了几个与此错误相关的问题 但我认为它们不太适用于我的情况 或者在某些情况下 不幸的是 我无法很好地理解它们来实现 P 我不确定我能否很好地描述这一点以寻求帮助 但这
  • Five9 的 API:如何使用 SOAP API 和基本身份验证提取报告

    我们正在尝试使用 Five9 的服务器报告 API 访问数据 我们在下面编写了代码 但没有得到任何结果 对我来说 问题似乎出在 Five9 服务器的身份验证上 请检查帮助我们了解如何定期提取特定活动的数据并将其存储在数据仓库中
  • php - 取消链接引发错误:资源暂时不可用

    这是一段代码 public function uploadPhoto filename storage temp image jpg file put contents filename file get contents http exa
  • Python 中 Chromedriver Selenium 的“Eager”页面加载策略解决方法

    我想加快 selenium 上页面的加载时间 因为除了 HTML 之外我不需要任何其他内容 我正在尝试使用 BeautifulSoup 抓取所有链接 使用 PageLoadStrategy NONE 无法抓取所有链接 并且 Chrome 不
  • UIActionSheet 事件未触发

    我有一个 UIActionSheet 来在表视图控制器上提供用户选项 我之前已经实现了这一点 没有出现任何问题 但现在由于某种原因 单击按钮时我的事件处理程序不会触发 在我的头文件中 我已经实现了正确的委托 如下所示 interface G
  • Django:此函数的关键字参数无效

    我想将一些数据插入到多对多字段中 我收到此错误 user 是该函数的无效关键字参数 我也尝试了相关名称 但仍然不起作用 我的模型如下所示 模型 py class Workspace models Model user models Many
  • 增加 Tomcat 堆大小

    我正在尝试增加 tomcat 的堆大小 这样我可以优化 GeoServer 性能 我所做的是 将 tomcat 默认文件中的 JAVA OPTS 值更改为 JAVA OPTS Djava awt headless true Xmx3072m
  • 词法作用域是否可以实现硬实时?

    我正在读书关于 funarg 问题 这实际上是维护词法闭包环境的问题 这是一篇旧论文 我不确定作者的结论是否仍然成立 但他强烈暗示 为了拥有词法作用域而不是动态作用域 你必须放弃传统的 C 风格堆栈 而采用树结构环境 从堆分配 这是否使得在
  • 如何根据页面 url 显示或隐藏选项卡

    这是我的代码 用于翻转选项卡和选项卡下的内容 function tabs li a click function e e preventDefault tabs li content current removeClass current