我有一个非常简单的jQuery代码,它没有按预期工作。
当我将鼠标悬停在div上时,我想更改div的类,并在鼠标离开div区域时恢复该类。这是我的代码。
function WireHandlers()
{
SetBannerHoverImage();
}
function SetBannerHoverImage()
{
$("#banner").hover( OnBannerHover. OnBannerOut );
}
function OnBannerHover()
{
$("#banner").removeClass("grayGradiant");
$("#banner").addClass("redGradiant");
}
function OnBannerOut()
{
$("#banner").removeClass("redGradiant");
$("#banner").addClass("grayGradiant");
}
$(document).ready( function() { WireHandlers(); } );
document.ready确实调用WireHandlers
,调用SetBannerHoverImage
,成功调用$(selector).hover()
方法。
但是,当我将鼠标悬停在div上时,不会调用OnBannerHover
和OnBannerOut
侦听器。
PS:可能需要注意的是,覆盖100%区域的div内部是一张桌子。
答案 0 :(得分:1)
与api.jquery.com的示例一样,您需要使用逗号分隔您的处理程序:
$( selector ).hover( handlerIn, handlerOut )
所以试试:
$("#banner").hover( OnBannerHover, OnBannerOut );
答案 1 :(得分:0)
也许尝试类似的事情:
$("#banner").hover(
function(){
$(this).removeClass('red').addClass('grey');
},
function(){
$(this).removeClass('grey').addClass('red');
}
);
答案 2 :(得分:0)
如果这不是拼写错误
$("#banner").hover( OnBannerHover. OnBannerOut );
那么它应该是
$("#banner").hover( OnBannerHover, OnBannerOut );
或者,您可以使用(hover
只是这些的简写)
$("#banner").on('mouseenter', function(){
$(this).removeClass("grayGradiant").addClass("redGradiant");
})
.on('mouseleave', function(){
$(this).removeClass("redGradiant").addClass("grayGradiant");
});