访问链接后,Firefox 有选择地跳过状态更改或 a:visited 样式

发布于 2024-07-17 23:30:42 字数 1089 浏览 4 评论 0原文

单击具有常见 href 的链接(本地页面或网站)后 并且href加载成功,FF2和IE7都会显示 带有 a:visited 样式的链接。

对于带有 href="javascript:anyfunc()" 的链接,IE7 的工作方式如上 而 FF2 不显示 a:visited 样式。 没有任何变化 文档类型。

问:JS 链接和 :visited 的行为是否被认为是正确的?

问:FF2 点击 JS 链接后锚点状态是否保持不变?

问:无需附加 onClick 处理程序或修改类/样式 使用JS,有没有一种简洁的方法告诉FF2使用:visted 样式独立于 href 是另一个页面还是 JS 链接?

示例如下:

<html>
<head>
<style>
div.links { font-size: 18px; }
div.links a { color: black; text-decoration: none; }

div.links a:visited { background-color: purple; color: yellow; }
div.links a:hover { background-color: yellow; color: black; }
</style>

<script>
function tfunc(info) { alert("tfunc: info = " + info) }
</script>
</head>
<body>

<div class="links">
    <a href="javascript:tfunc(10)">JS Link 1</a><br>
    <a href="javascript:tfunc(20)">JS Link 2</a><br>
    <a href="http://www.google.com/">Common href, google</a>
</div>

</body>
</html>

After clicking a link with a common href (local page or web-site)
and the href is successfully loaded, both FF2 and IE7 will display
the link with a:visited styling.

For links with href="javascript:anyfunc()", IE7 works as above
while FF2 does not display a:visited styling. No change with any
DOCTYPE.

Q: Is either behaviour with JS links and :visited considered correct?

Q: Does FF2 leave anchor state unchanged after clicking a JS link?

Q: Without having to attach an onClick handler or modify classes/style
with JS, is there a concise way to tell FF2 to use :visted
styling independent of whether href is another page or a JS link?

Example follows:

<html>
<head>
<style>
div.links { font-size: 18px; }
div.links a { color: black; text-decoration: none; }

div.links a:visited { background-color: purple; color: yellow; }
div.links a:hover { background-color: yellow; color: black; }
</style>

<script>
function tfunc(info) { alert("tfunc: info = " + info) }
</script>
</head>
<body>

<div class="links">
    <a href="javascript:tfunc(10)">JS Link 1</a><br>
    <a href="javascript:tfunc(20)">JS Link 2</a><br>
    <a href="http://www.google.com/">Common href, google</a>
</div>

</body>
</html>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

冷清清 2024-07-24 23:30:42

设计这些类型的链接会很困难...虽然它们可能具有相同的 href,但它们可能通过 JS 执行任何操作(这可能会使访问它看起来不会)。

有没有办法链接到 HTML 页面等内容并将事件处理程序附加到链接(并返回 false 以阻止链接点击)? 如果链接实际上是 JS 钩子,我将使用诸如

在 href 中使用内联 javascript:function(something) 是不好的做法。 尝试不引人注目的事件处理程序。

It would be difficult to style these sorts of links... whilst they may have the same href, they could potentially do anything through JS (which may make it seem that visiting it would not).

Is there a way to link to something such as a HTML page and attach event handlers to the link (and return false to stop the link clicking through)? And if the links are in fact JS hooks, I would use an element such as a <button> and style it accordingly... remember to add cursor: pointer so the end user knows it is clickable.

Using inline javascript:function(something) in a href is bad practice. Try unobtrusive event handlers.

我也只是我 2024-07-24 23:30:42

在 CSS 定义中,a:hover 必须位于 a:link 和 a:visited 之后才能生效!

a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective!

樱&纷飞 2024-07-24 23:30:42

这是我的看法:

问:JS 链接和 :visited 的行为是否正确?

链接的目的是检索资源。 如果您的链接没有到达任何地方,那么您正在“访问”什么? 我认为从这个角度来看,这种行为是正确的。

问:FF2点击JS链接后锚点状态是否保持不变?

似乎它不会将链接的状态更改为 :visited ,除非它指向页面中的某个元素(这意味着链接指向隐式访问的当前页面)或指向已访问的另一个资源。

问:无需附加 onClick 处理程序或使用 JS 修改类/样式,是否有一种简洁的方法来告诉 FF2 使用 :visted 样式,而不管 href 是另一个页面还是 JS 链接?

我不这么认为。 如果将链接的 href 指向“#”并使用 onclick 处理程序来满足您的 JavaScript 需求,您可能会获得访问的效果。

Here's my take:

Q: Is either behaviour with JS links and :visited considered correct?

The purpose of a link is to retrieve a resource. If your link doesn't go anywhere, what are you "visiting"? The behavior is correct from this perspective in my opinion.

Q: Does FF2 leave anchor state unchanged after clicking a JS link?

It seems as though it doesn't change the state of the link to :visited unless it points to an element in the page (which means the link points to the current page which is implicitly visited) or to another resource which as already been accessed.

Q: Without having to attach an onClick handler or modify classes/style with JS, is there a concise way to tell FF2 to use :visted styling independent of whether href is another page or a JS link?

I don't think so. You can probably get the visited effect if you point the href of the link to "#" and use the onclick handler for your JavaScript needs.

真心难拥有 2024-07-24 23:30:42

我遇到了我相信这个问题所问的问题。 考虑这个简单的例子:

样式表:

#homebox { display: none;}
#contactbox { display: none; }

html:

<a id="#home"></a>
<a href="#home" onclick="return showHideDiv(this);">Show Home</a>
<div id="homebox">Your home</div>
<a id="#contact onclick="return showHideDiv(this);"></a>
<div id="contactbox">Contact Info</div>

脚本:

function showHideDiv(elem) {
if( elem.style.display && elem.style.display == "none"; ) elem.style.display = "block";
else if( elem.style.display && elem.style.display == "block"; ) elem.style.display = "none";
return true;
}

虽然不是最漂亮的代码,但它指出了在 href 中使用 javascript onlick 时可能出现的一些问题。 您可能想做这样的事情的原因是创建动态内容更改而不重新加载以显示访问的样式。 a 链接比按钮更方便,因此即使是内部链接,也会保持链接的访问状态。 但是,我注意到浏览器在内部链接上触发访问状态存在一些问题,更不用说带有 javascript onclick 事件处理程序的内部链接了。 按钮需要编写一个函数来控制访问的样式。

I have encountered the issue I believe this question is asking. Consider this simple example:

style sheet:

#homebox { display: none;}
#contactbox { display: none; }

html:

<a id="#home"></a>
<a href="#home" onclick="return showHideDiv(this);">Show Home</a>
<div id="homebox">Your home</div>
<a id="#contact onclick="return showHideDiv(this);"></a>
<div id="contactbox">Contact Info</div>

script:

function showHideDiv(elem) {
if( elem.style.display && elem.style.display == "none"; ) elem.style.display = "block";
else if( elem.style.display && elem.style.display == "block"; ) elem.style.display = "none";
return true;
}

Although not the most beautiful code, it points out some issues which can develop when using javascript onlick within a href. The reason you might want to do something like this, is to create dynamic content changes without reload which show a visited style. The a links would be handier than buttons, so the visited status of the links is maintained, even though internal. However, I have noticed some issues with browsers triggering visited status on internal links, let alone internal links with javascript onclick event handlers. A button would require coding a function to control visited styles.

北恋 2024-07-24 23:30:42

我同意 Alex 的观点,链接应该是某个东西的链接,而不是 JS 触发器 - 按钮在这里会更有效。

如果您确实想将一些 JS 函数附加到链接,那么您绝对应该使用一些不显眼的 JS 将该函数附加到单击事件。

使用 jQuery 的 EG:

$("#myLinkID").click(function () { 
  //function stuff
});

I agree with Alex, a link should be a link to something, not a JS trigger - a button would much more effective here.

If you do want to attach some JS function to a link, you should definitely use some unobtrusive JS to attach that function to the click event.

EG using jQuery:

$("#myLinkID").click(function () { 
  //function stuff
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文