点击后悬停状态不起作用

所以我有这个页面https://tricote.net/contact/ 如果您在左侧有几个链接，点击它们，它会启动您的邮件应用程序，并让您发送电子邮件到商店。点击后悬停状态不起作用

然而，点击其中一个，之后点击链接悬停在关闭和休息的链接状态将不会在悬停状态....

又是有什么办法可以解决这个问题..？感谢您提前预定时间...！

2016-11-21 Hirohito Yamada

它看起来对点击功能的JavaScript事件监听器，它不是一个简单的悬停的事情。 –

悬停状态将被关闭，因为浏览器检测到光标不再悬停在按预期工作的框上。这里的问题是你有JavaScript代码，增加了内嵌样式在箱子上。您必须按照Aliester的指示移除它，以便它可以正常工作。你可以通过运行这个代码'$（“。contactbox”）来检查它。each（function（i，e）{$（e））。css（“background”，“”）;}）;'在浏览器控制台中单击其中一个框以显示问题。 – josephting

好了，所以这是你的问题代码：

$(".contactbox").each(function() { 
     var e; 
     return e = this, 
     $(e).on("click", function() { 
      var t, n; 
      return t = $(".contactbox").index(e), 
      $(".contactbox").css("background", "#fff"), 
      $(e).css("background", "#648d85"), 
      n = $(".contactbox").eq(t).data("label"), 
      $("#contact_subject").val(n) 
     }) 
    })

本质上要设置使用HTML元素的“style”属性，当你用“的CSS”的背景色。这会覆盖CSS文件中设置的任何内容。我相信这也会覆盖“悬停”式样。

所以，你会想改变这些行：

$(".contactbox").css("background", "#fff"), 
$(e).css("background", "#648d85")

你可以创建一个额外的类中指定，而不是使用“的CSS”，即“主动”元素的造型。这可能是这样的：

$(".contactbox").removeClass("activeElement"); 
$(e).addClass("activeElement");

这样，您就可以控制通过排序在CSS文件覆盖什么，或者提供了“activeElement”类的悬停行为的额外CSS规则。

EDIT1：好了，所以从您的评论是听起来像你真的不希望样式用户的最后选择。因此，而不是仅仅删除这些行：

$(".contactbox").css("background", "#fff"), 
$(e).css("background", "#648d85")

我还以为你想向用户表明什么最后的选择了。这听起来像你不希望这样，你不需要使用“removeClass” /“addClass”我上面包括线。

希望我理解你想要做什么。如果这里没有列出这些元素的可能状态。请添加评论或更新您的问题，指出您希望每种状态组合的样式。我编号的，所以你可以按编号引用它

当前可能的状态：

项目中选定/未悬停
项目中选择/悬停
项目未选中/未悬停
项不可Selected/Hovering

使用此编辑中的建议（State-1 === State-3）和（State-2 ===国家-4）。

来源

2016-11-21 03:09:02 Adrian

谢谢！现在，其他链接可以在点击一个链接后关闭悬停状态。但是，单击一个链接后，即使将鼠标从链接中移除，您点击的相同链接也不会关闭悬停状态。还有其他任何事件会导致此问题发生？ –

@HirohitoYamada我不知道我明白。从您的代码当前选择一个项目时，它的背景颜色设置为与悬停样式相同的颜色。我以为你打算用这个来表示活动元素。如果你可以描述你想要什么样的风格：“选择和不盘旋”，“选择并悬停”，“未选中和不盘旋”以及“未选中和盘旋”，那么我可以更新我的答案。 – Adrian

对不起，评论混乱。因此，继承了我在申请建议后留下的问题。 1：你点击一个，打开邮件应用程序。 2：Cliecked链接背景，留在悬停，它不会回到白色背景，不管... –

点击后悬停状态不起作用

回答

相关问题