[英]Anchor element not working in firefox and chrome
我的客户网站上的图像上有一个超链接。 它可以在IE中运行，但是当我在Chrome / Mozilla中打开同一页面时，它没有显示锚定指针，并且在单击任一指针时都没有任何反应。 我的代码：
<a href="Home.aspx?ModuleID=1">
<img alt="Alternative Text" src="Images/Logo.gif" />
</a>
有人知道这个问题可能是什么吗？
简单的变通方法：在迄今为止我测试过的所有浏览器中都可以使用document.getElementById([anchor tag]).scrollToView(true);
示例：-from--
<a href="#" onclick="document.getElementById('ShowMeHow2').scrollIntoView(true);return false;">
- 至 -
<a id="ShowMeHow2" name="ShowMeHow2"> </a>
检查页面中是否完全使用css z顺序。 不正确的z顺序会导致按钮和链接不起作用。
我发现，对于同一个Chrome *的同一问题，对我有用的是，不要将锚点ID括在块级元素中，而应将标注括起来。
例如
<body>
<a id="top" name="top"> </a>
<p>...</p>
<p><a href="#top">Back to Top</a></p>
</body>
<!-- /end ex. -->
希望这会有所帮助:)在所有浏览器中均可使用。
-本
我正面临着同样的问题。 这个建议 （添加位置：相对于包含div的位置）似乎可以解决此问题，但是我正在绝对定位并且需要以其他方式解决此问题。 我认为这可能会对其他人有所帮助。
不要将＃字符放在锚点上，仅在链接中
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>
我在Chrome浏览器中遇到了类似的问题，将鼠标悬停在导航链接上时，光标没有变为指向手，而单击链接时，链接本身没有响应。 通过将值999的z-index属性添加到样式表中的我的锚元素中，返回了预期的行为。
我有类似的情况。 就我而言。 我试图使用左/右浮动对齐3 div。 其中之一具有position：relative属性。 一旦我删除了这个，然后Firefox的锚标签工作。 而不是添加额外的属性。 希望这可以帮助其他人。
我发现有时您可能会误将另一个具有相同ID的元素。 就我而言，它是一个选项标签，无法移动到视图中。 因此，我建议您尝试$('#yourid')来查看是否有意外的标签具有相同的ID。
我花了最后几个小时来解决这个问题，在可用于Firefox和IE的页面锚标签中，而不是可用于Chrome中。 我不是专业开发人员，所以我不知道为什么，但是在某些情况下，chrome似乎无法从堆叠的div内读取标签，而是将您传送到同一页上的所需位置。 我通过在我的ID后面添加跨度ID来解决这个问题-看起来像这样：
<a href="#ID_NAME"></a>
...
<a id="ID_NAME><a/><span id="ID_NAME"></span>
在Firefox，Chrome和Safari中进行了测试。 虽然在此计算机上没有IE进行测试。
与此相关的另一个可能发生的问题（尽管这里可能不是这种情况）是您可能已经更改了a标签的css指针声明。
a {
cursor: default;
}
如果是这种情况，悬停效果和单击链接仍然应该起作用。
它看起来很愚蠢，但我曾经遇到过同样的问题。我只是将锚链接放置在现有页面中作为增强功能的一部分。奇怪的是，这些链接在IE中是可单击的，但在chrome / firefox中却不是。
仔细查看后，我发现有一个现有脚本删除了用于打印功能的锚标记链接。 添加的锚标记是同一页面的一部分，因此出现了此问题。 我添加了带有新添加的锚的id的if条件，以便它们将跳过添加的功能以删除锚的链接。
对于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部分中即可。 它为我工作！ :)
如果没有完整的HTML源代码，我将指出该锚是嵌套的，还是位于某些没有结束标记的元素之后。
如果这不是问题，请发布完整的HTML源代码。
通过使用以下方法验证文档，您可以轻松找到此问题：
它是W3C官方的HTML / XHTML验证器，因此，如果未关闭某些元素，它将指出您需要更正的那个！
编辑：观看答案注释中张贴的HTML源代码之后...文档类型（DOCTYPE）声明在哪里？ 您忘记添加了！
在HTML文档的开头添加以下内容：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
如果不提供文档类型，浏览器将以“ quicks”模式呈现网页，这是一种兼容模式，可能无法按预期呈现页面。 在此处了解有关此内容的更多信息：
让我知道这是否可以解决您的问题！
来自其他页面的锚无法在Firefox和IE中运行（在Chrome中有效）
[英]Anchor from another page not working in Firefox and IE (works in Chrome)
命名锚链接在dojo对话框中不起作用（chrome和firefox）
[英]Named anchor links not working inside dojo dialog (chrome and firefox)
jQuery“在滚动之前删除锚点”功能在Firefox中不起作用，但在chrome，safari中完美运行
[英]jQuery 'remove anchor before scroll' function not working in firefox but working perfect in chrome,safari
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.