Question

我借用了某人的jquery函数并将其改编为我自己使用，但我不明白它是如何工作的。特别是行var content = this.hash.replace('/', '');

有人可以在这方面解释.hash吗？完整的jsFiddle在这里：http://jsfiddle.net/bsapaka/KjcnL/3/

$(document).ready(function () {

    var tabs = $(".tabs-group li a");

    tabs.click(function () {
        var content = this.hash.replace('/', '');
        tabs.removeClass("active");
        $(this).addClass("active");
        $("#panel > div").hide();
        $(content).fadeIn(700);
        $(this).delay( 800 );
    });

});

Answer 1

在href之后（包括）#获得部分。

<a>元素有几个这样的属性，例如：

hash
host
href
hostname
pathname
protocol
search

在该上下文中，他们使用散列作为id来获取另一个元素。因为#存在，所以它是一个有效的id选择器。

Answer 2

如果您查看以下锚标记的设置方式：

<li><a href="#/hnf">Health & Fitness</a>

哈希值是href属性之后的一部分，包括主题标签：＃

在这种情况下，代码存储在散列中单击锚标记时要显示的元素的ID，然后在下面的几行中，散列的值用作JQuery选择器以显示指定的元素（请注意，hashtag也是JQuery中的ID选择器）：

var content = this.hash.replace('/', ''); // returns '#hnf' for the <a> tag above
[...]
$(content).fadeIn(700); // '#hnf' is the ID of an image on your page to display

请注意，因为当用户尝试使用后退按钮时，以这种方式使用哈希导航可能会导致意外结果。 Hashtag导航通常用于在显示新数据时在浏览器的历史记录中创建条目，而无需实际导航到不同的HTML页面。你应该进一步研究哈希导航，以防止出现一些陷阱。如果您发现后退按钮行为不受欢迎，以下SO帖子可能是一个好的起点：

How to make the browser back button disregard hash tags?

Answer 3

我相信在包含href属性或属性的元素上找到哈希

粗体文字是哈希。

http://www.example.com/page.html的 #stuff

jquery - 此函数中.hash的重要性

3 个答案: