Question

我有一个命名的锚标记：

<table id="search_results" name="search_results">

我正如此链接：

pagename.php#search_results

这适用于Firefox和Chrome，但不适用于IE（8）。

我已尝试使用其他帖子中建议的<a>标记。我也尝试给搜索结果表css：

display: inline-block

根据this article上的一位评论者的建议。我的表也总是有内容，文章建议这可能是IE拒绝它的原因。

我很感激任何建议。

非常感谢

Answer 1

这就是我寻求不同解决方案的动力：

添加的文字不适合显示，不间断的空间导致段落之间出现额外的行间距。这可能已得到纠正，但多MB页面需要大量的手动工作。

使用iPage开发的页面可在此处查看：www.theUB.org

一些专业人士告诉我，在网站设计中通常会避免使用这么长的页面，但是这些页面（包含许多命名锚点和“点和点击”目录）似乎适用于2000年页面公共领域文本。

Answer 2

不间断空间解决方案的另一个缺点：

此在线文本需要由电脑屏幕阅读器正确阅读。有些人评论过其他博客，屏幕上的读者会说出不间断的空间（或添加文字）。

（请注意段落编号后面添加的小数点 - 这是防止屏幕阅读器发出合并的段落编号和段落的第一个单词所必需的。）

Answer 3

夫妻俩：

IE8不支持内联块;）

当您尝试使用最好的锚时，您的代码就像

<a name="search_results"></a>
<table name="search_results" id="search_results">
</table>

<a name="">方法几乎得到普遍支持。

Answer 4

首先，使用命名锚点来导航页面就可以实现它所说的内容。您已使用命名的锚点（<a>标记）来执行此操作。有些浏览器支持非锚点，但这不是通用的，不应该依赖 - 正如你所发现的那样。

其次，你确定你的页面足够长吗？如果您尝试链接的内容位于页面底部，则它不会像您预期的那样显示在视口的顶部，因为它下方没有任何内容可以显示在页面底部。 / p>

第三，检查您是否正确执行了命名锚点。你应该做这样的事情：

<a name="search_results"></a>
<table name="search_results">
...

Answer 5

关于不需要文本的命名锚点：

其他人建议IE8的“解决方法”：如果不需要文本（ ），请插入“不间断空格”字符。

然而，我还发现将IE8的视图/缩放从125％重置为100％也激活了未通过“非破坏空间”解决方案纠正的锚点。 IE8的视图/文本大小不是此问题的一部分。

注意：正在测试大型文本的HTML页面：（font face="Verdana" size="+1"）。这些HTML页面在Firefox 15.01中正确显示，而不考虑“查看/缩放”，“文本大小”设置。

Answer 6

我通过在锚点中添加一些文本来实现这一点，例如：

<a name="search_results">&nbsp;</a>

Answer 7

这似乎是IE大文件加载延迟的另一种解决方案：创建一个较小的HTML文件，通过HREF链接到大文件（或该文件中的书签（命名锚））。

此测试已尝试多次，IE大直接加载大文件总是会导致长时间延迟，但是当用户单击小文件中的链接转到大文件时则不会。

也许，IE正在分析主文件以查看它是否已经加载到缓存中。

注意：这个正在测试的HTML文件是11 MB（整本书有很多书签，并且链接到这个非常长的HTML页面的其他部分的书签）。

Answer 8

我在IE，Edge和chrome上面临同样的问题，

我认为问题在于名称属性

上的encoding and decoding

所以我做了workaround solution，看看

anchorElem.on("click",function() {
            var href = $(this).attr('href');
            var scrollEle = $(".tocContent").find('a[name="' + href.substr(1) + '"]' + ', a[name="' + decodeURIComponent(href).substr(1) + '"]');
            if (scrollEle.length > 0) {
                $('html, body').animate({
                    scrollTop: scrollEle.offset().top
                }, 0);
                return false;
            }
        })

希望这能帮到你

并且很高兴解决browser compatibility issues

链接到命名锚不在IE中工作 - 已经在SO上尝试过建议的解决方案

8 个答案: