Question

我的函数检查哈希的URL，返回它的值，使用该值查找图像（通过ID）并为其应用类名。我的控制台没有显示任何错误，但我没有看到预期的结果。

不是按返回的.z值过滤hash类，而是将所有.z类写入id=image

有没有更好的方法来过滤该值并将其用作ID？谢谢！

JavaScript的：

(function($){
$.brantley = function(callback) {
    var $doc = $(document),
        $win = $(window),
        $z, $load, $footer, $header, $status, $container, $hash;

    $doc.ready(function() {
        $z          = $('.z');
        $load       = $('#load');
        $footer     = $('footer');
        $header     = $('header');
        $status     = $('#status');
        $container  = $('#container'),
        hash        = gethash();

        if(hash) {
            var image = hash;
            $('.z').attr('id', 'image').addClass('active');
        } else {
            $('.z:first').addClass('active');
        }

    });

    function gethash() {
        var hash=window.location.hash;
        hash=hash.replace(/#/,'');
        return hash;
    }

    function updateNumber(type) {
        window.location = window.location.pathname + "#" + type;
    }

};
})(jQuery);

编辑：

考虑所有评论以及答案，这是我完成的内容：

(function($){
$.brantley = function(callback) {
    var $doc = $(document),
        $win = $(window),
        $z, $load, $footer, $header, $status, $container;

    $doc.ready(function() {
        $z          = $('.z');
        $load       = $('#load');
        $footer     = $('footer');
        $header     = $('header');
        $status     = $('#status');
        $container  = $('#container');

        var hash = gethash();

        if(hash) {
            $('#' + hash + '.z').addClass('active');
        } else {
            $('.z:first').addClass('active');
        }

        bromance();
    });

    $win.load(function() {
        bromance();
        $load.fadeOut('fast', function() {
            $('.active').fadeIn('slow');
            $status.fadeIn('slow');
            $footer.fadeIn('slow');
        });
    });

    $win.resize(function() {
        bromance();
    });

    function gethash() {
        var hash=window.location.hash;
        hash=hash.replace(/#/,'');
        return hash;
    }

    function updateNumber(type) {
        window.location = window.location.pathname + "#" + type;
    }
};
})(jQuery);

Answer 1

您不是按ID过滤，而是更改ID。要按ID过滤，请使用：

if(hash) {
    var image = hash;
    $('#' + image + '.z').addClass('active');
} else {
    $('.z:first').addClass('active');
}

或者只是摆脱那个多余的变量：

if(hash) {
    $('#' + hash + '.z').addClass('active');
} else {
    $('.z:first').addClass('active');
}

Answer 2

我认为你的问题就在这一行：

$('.z').attr('id', 'image').addClass('active');

其中说“选择所有带有'z'类的元素，并将'id'属性设置为字符串'image'，然后添加类'active'。

你想要做的是：

$('#' + image).addClass('active');

其中说“选择id等于变量image中任何内容的元素，并添加”active“类。

注意，如果你有一个id，你不需要在类上选择，因为id应该在页面中是唯一的。您可以使用类和 id，$('.z#' + image)的选择器，但除非您在页面上有重复的ID，并且，否则它是多余的有重复的ID，您的HTML无效，并且您将无法在不同的浏览器中获得一致的结果。

编辑：如果你不想更改元素，除非它具有那个id 和 z类，那么使用我上一段中的$('.z#' + image)选择器。或$('#' + image + '.z')。

jQuery检索哈希并将其作为ID应用

2 个答案: