如何切换 jquery 哈希 url答案

【问题标题】：How to toggle a jquery hash url如何切换 jquery 哈希 url
【发布时间】：2019-05-23 22:03:50
【问题描述】：

这是漫长的一天，我怀疑这是造成这个看似简单的问题的原因。

我有一个汉堡菜单，我需要打开#url，它需要在以下之间切换：

Open = #open
Close = #close

我的jquery 代码如下所示：

        $('.menu').click(function () {
            $(this).attr("href","#close");
        });

而我的html 看起来像这样：

 <a href="#open" class="menu">
   <b></b>
   <b></b>
   <b></b>
   <span>Menu</span>
</a>

我可以正常打开菜单，也可以关闭它，但是，一旦我关闭了菜单，我就无法再次打开它，因为href 仍然显示为#close。所以，我想知道如何切换它，所以无论url，href 是相反的吗？

感谢任何帮助。

【问题讨论】：

window.location.hash = "open"
Using location.hash to activate jquery toggle/slideToggle的可能重复
@RoryMcCrossan 你能否扩展 window.location.has 以及它适合我的脚本的位置，我以前没有使用过它。
该行将进入您的 click 处理程序。还有pushState() 可以让您进行更多控制。详情见 MDN：developer.mozilla.org/en-US/docs/Web/API/…
@RoryMcCrossan 我试过了，但它似乎不起作用，您能否发布一个修改后的代码以确保我没有在某个地方搞砸？

标签： jquery

【解决方案1】：

每次单击菜单时检查href属性值是多少并更改它的值？

这应该可行：

$('.menu').click(function() {
    if($(this).attr("href") == "#open") {
        $(this).attr("href", "#close");
    } else {
        $(this).attr("href", "#open");
    }
});

【讨论】：

【解决方案2】：

我通常使用<a href="#open">，但也可以使用window.location.hash。处理它的一个好方法是使用以下操作来执行您的操作：

$(window).on('hashchange', function() {
});

我使我的哈希字符串与 HTTP GET 字符串完全一样，手动解析这些对，然后将其发送到 AJAX 调用。这是让 AJAX 处理直接链接和浏览器历史记录的好方法。

【讨论】：

【解决方案3】：

以下解决方案适用于您的情况。

    $('.menu').click(function(e) {
      var hash = (e.currentTarget.hash === "#close") ? '#open' : '#close'
      $(this).attr("href", hash);
    });

【讨论】：