html - 在悬停时更改输入的 BGcolor，然后在 mouseout 时返回，但如果输入有焦点，禁用 mouseout BGcolor 更改

Question

我有一个输入，当有人将鼠标悬停在输入上时，我希望它的 BGcolor 变为灰色，然后当他们悬停在输入上时，我希望它的 BGcolor 变回白色(默认颜色)。但我也希望输入的 BGcolor 在输入焦点上变为灰色，但是当人将焦点放在输入上，然后将光标从输入上移开时，即使输入有，BGcolor 也会变回白色重点。所以基本上我希望在输入框有焦点时禁用 mouseover mouseout 功能，然后当它不再有焦点时，重新启用 鼠标悬停 mouseout 功能。

谁能帮帮我？我不确定该怎么做...

Answer 1

您可以仅使用 CSS(为什么不保持简单？)，根本不需要 JavaScript:

input { background: white; }
input:focus, input:hover { background: gray; }

You can test it out here .

如果我完全按照你说的去做，它在脚本中看起来像这样(完全禁用悬停)，你可以使用 .live() 来实现或 .delegate() ，像这样:

$("input").live("focus blur", function() {
  $(this).toggleClass("focused");
});
$("input:not(.focused)").live("mouseenter", function() {
  $(this).addClass("grayBG");
}).live("mouseleave", function() {
  $(this).removeClass("grayBG");
});

最后 2 个处理程序不会在元素获得焦点时对其进行操作(并且具有 .focused 类)。