Anchor标记不能在Firefox和Chrome中工作

我正面临一个令人惊讶的问题。我在客户端网站上的图像上有超链接。它在IE中工作，但当我在Chrome/Mozilla中打开相同的页面时，它不显示锚点指针，点击时也没有任何反应。我的链接代码是Anchor标记不能在Firefox和Chrome中工作

<a href="Home.aspx?ModuleID=1"> 
    <img src="Images/Logo.gif" border="0"/> 
</a>

有人知道这个问题是什么吗？

来源

2011-02-03 surenv2003

如果没有完整的HTML源代码，我会指出这个锚点是嵌套的，或者是一些没有结束标记的元素之后。

如果这不是问题，发布的HTML代码完整。

您可以通过验证您的文档轻松找到这个问题：

http://validator.w3.org/

这是W3C官方HTML/XHTML验证，因此，如果某个元素不是封闭的，它会指出哪一个你需要纠正！

编辑：看到你的HTML源代码张贴在答案的评论...文档类型（DOCTYPE）声明在哪里？你忘了添加它！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

当你不提供文档类型，浏览器显示网页中的“quircks”模式，这是可能不会呈现兼容模式：

在HTML文档的开头添加这你的页面如你所料。了解更多关于在这里：

http://en.wikipedia.org/wiki/Quirks_mode

让我知道如果这能解决您的问题！

来源

2011-02-03 09:51:03

我检查了http://validator.w3.org/没有检测到未封闭的标签。只要连接到服务器，我就可以共享整个代码 – surenv2003 2011-02-03 11:45:00

由于用户限制，无法发布整个代码 – surenv2003 2011-02-03 12:11:08

严正，请使用http://pastebin.com/并发布评论和链接！ ;） – 2011-02-03 12:12:57

检查您是否在页面中使用css z-order。不正确的z顺序可能会导致按钮和链接不起作用。

来源

2011-12-08 21:37:37 Sean

我面临同样的问题。 This suggestion（加入的位置：相对到包含div）似乎应付它，但我正在做绝对定位，需要以另一种方式解决此问题。不过，我想它可能会帮助其他人。

来源

2011-12-27 23:54:18 cdonner

简单的解决方法：这个作品在我测试了使用至今的所有浏览器document.getElementById([anchor tag]).scrollToView(true);

例子： --from--

<a href="#" onclick="document.getElementById('ShowMeHow2').scrollIntoView(true);return false;">

--to--

<a id="ShowMeHow2" name="ShowMeHow2"> </a>

来源

2012-02-21 16:35:01

我有一个类似的情况。就我而言。我正在尝试使用左/右花车对齐3个div。其中一个有位置：相对属性。一旦我删除了这个，然后Firefox的锚标签工作。而不是添加额外的属性。希望这可以帮助其他人。

来源

2012-06-15 00:27:10 Farjad

我发现有时候您可能会错误地使用相同ID的其他元素。在我的情况下，它是一个选项标签，不能移动到视图中。因此，我建议您尝试$('#yourid')以查看是否有任何标签意外地具有相同的ID。

来源

2013-05-09 17:34:24

我发现只针对与Chrome *相同的问题，我的工作是不将封闭标识封装在块级元素中，而是附上标注。

ex。

<body> 
    <a id="top" name="top"> </a> 
    <p>...</p> 
    <p><a href="#top">Back to Top</a></p> 
    </body> 
    <!-- /end ex. -->

希望这有助于:)在所有浏览器中都能正常工作。

-Ben

来源

2014-01-25 19:28:43

我已经花了几个小时，这个问题，在页面锚标签在Firefox和IE的工作，但没有铬。我不是一个专业的开发人员，所以我不知道为什么，但看起来在某些情况下，chrome不会从堆叠的div中读取标签，并将您发送到同一页面上的所需位置。我绕着它通过添加一个跨度的ID我一个ID后面... - 所以它看起来是这样的：

<a href="#ID_NAME"></a> 
... 
<a id="ID_NAME><a/><span id="ID_NAME"></span>

在Firefox，Chrome和Safari浏览器进行测试。尽管这台机器上没有IE来测试。

来源

2014-04-10 07:26:44 Tim

可能发生的另一个可能的问题（尽管这可能不是这种情况）是你可以改变a标签的css指针声明，例如。

a { 
    cursor: default; 
}

如果是这种情况，悬停效果和点击链接应该仍然有效。

来源

2014-06-11 22:28:34

它看起来很愚蠢，但我曾经有过同样的问题。我只是将锚链接放在现有页面中作为增强功能的一部分。显然链接在IE中可点击，但在Chrome/Firefox中无法点击。

一旦仔细查看，我发现有一个现有的脚本可以删除打印功能的定位标记链接。添加的锚标签是同一页的一部分，因此存在此问题。我添加如果条件与新添加的锚的ID，以便他们将跳过添加的功能删除锚的链接。

来源

2014-07-29 22:56:48

不要把＃字符锚泊，只是在链接

Correct <a name="top">[top of page]</a> <a link="#top">[link]</a> 

Incorrect <a name="#top">[top of page]</a> <a link="top">[link]</a>

来源

2015-08-18 16:53:31

对于Firefox，在页面的HEAD部分应用此脚本。

<script> 
    $(document).ready(function(){ 
     var h = window.location.hash; 
     if (h) { 
      var headerH = $('#navigationMenu').outerHeight(); 
      $('html, body').stop().animate({ 
       scrollTop : $(h).offset().top - headerH + "px" 
      }, 1200, 'easeInOutExpo'); 

      event.preventDefault(); 
     } 
    }); 
</script>

对于Chrome，请在页面的HEAD部分使用以下内容。

<script> 
    $(document).ready(function() { 
     var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor); 
     if (window.location.hash && isChrome) { 
      setTimeout(function() { 
       var hash = window.location.hash; 
       window.location.hash = ""; 
       window.location.hash = hash; 
      }, 300); 
     } 
    }); 
</script>

只需将脚本复制并粘贴到页面的HEAD部分即可。它为我工作！ :)

来源

2017-01-29 18:16:31 sammy

我在Chrome中遇到了类似问题，其中当光标在我的导航链接上悬停时并未更改为指针，并且链接本身在单击时没有响应。通过在我的样式表中添加一个值为999的z-index属性到我的锚点元素，返回预期的行为。

来源

2017-02-20 12:55:39

Anchor标记不能在Firefox和Chrome中工作

回答

相关问题