与 css 结合使用时不会触发 click 事件：active答案

【问题标题】：click event does not fire when coupled with css :active与 css 结合使用时不会触发 click 事件：active
【发布时间】：2010-06-23 16:15:43
【问题描述】：

我创建了一个导航菜单，当单击链接时，会打开一个 jquery 对话框。

在我的 css 中的这些相同链接上，我有：
.navigationLinkButton:active { background:rgb(200,200,200); }
对话框附上简单的：
$("#link").click(function() {$(this).dialog("open")});

有时（大约每 4-5 次单击）当用户单击链接时，对话框不会打开，只有链接的背景颜色会发生变化。再次单击该链接将打开该对话框。任何想法为什么会发生这种情况？

【问题讨论】：

在这个问题中，背景颜色似乎无关紧要并且令人困惑。你有一个javascript问题。
当我完全删除 :active css 属性时，问题就消失了。当我改为通过 JavaScript 更改颜色时，问题也消失了。

标签： jquery css events jquery-ui

【解决方案1】：

$("#link").click(function() {$(this).dialog("open")}

应该是

$("#link").click(function(){$(this).dialog("open")});

还要确保页面上只有一个#link。如果不这样做，请尝试改用类（“.link”）

【讨论】：

) 问题很可能是错字。否则，OP 的代码将永远无法工作。
是的，这是一个错字。我确实有一个')'。我的页面上也有一个#link。

【解决方案2】：

确保您没有在页面上多次使用#link ID。

如果您的链接是 <a> 元素（我认为它们必须是，因为您使用的是 :active），请在您的 click() 处理程序末尾尝试 return false;。

这将禁用可能刷新页面的链接的默认行为。

$("#link").click( function() {
    $(this).dialog("open");
    return false;
});

【讨论】：