$(':target') returns Internet Explorer 11 中的长度 0

Question

我正在尝试补偿网页中锚点的移动位置，使其不被固定的 header 覆盖。

我用这个 anwser 解决了这个问题，它适用于除 IE 之外的所有浏览器。它只是在锚点移动后向上滚动几个像素。

代码如下：

(function($, window) {
    var adjustAnchor = function() {

        var $anchor = $(':target'),
                    fixedElementHeight = 160;
        console.log("Anchor: "+ JSON.stringify($anchor));

        if ($anchor.length > 0) {
            $('html, body')
                .stop()
                .animate({
                    scrollTop: $anchor.offset().top - fixedElementHeight
                }, 200);
        }
    };

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

})(jQuery, window);

现在，console.log 在 IE11 中的输出是这样的：

{
    "length": 0,
    "prevObject": {
        "0": {
            "__IE_DEVTOOLBAR_CONSOLE_EVAL_ERROR": false,
            "_html5shiv": 1,
            "jQuery1111049273906621767055": 4
        },
        "context": {
            "__IE_DEVTOOLBAR_CONSOLE_EVAL_ERROR": false,
            "_html5shiv": 1,
            "jQuery1111049273906621767055": 4
        },
        "length": 1
    },
    "context": {
        "__IE_DEVTOOLBAR_CONSOLE_EVAL_ERROR": false,
        "_html5shiv": 1,
        "jQuery1111049273906621767055": 4
    },
    "selector": ":target"
}

问题显然是 "length": 0，这意味着没有选择任何东西。为什么是这样？ :target 选择器在 IE11 中应该可以正常工作，但 jQuery 没有抓住它。

请原谅我的无知jQuery和我糟糕的英语

Answer 1

我通过将 id 属性添加到锚点的目标 name 属性旁边解决了这个问题，如下所示：

<a class="anchor" name="condiciones" id="condiciones"></a>

出于某种原因，name 属性足以让锚点在每个浏览器中工作，但为了在 Internet Explorer 中使用 jQuery 抓取它们，必须使用 id 属性制作锚点。

我讨厌 IE。

$(':target') returns Internet Explorer 11 中的长度 0

$(':target') returns length 0 in Internet Explorer 11

javascript

jquery

internet-explorer-11