我确定我忽略了一些东西,但是在我替换触发了mouseenter的锚标签中的html之后,似乎无法触发“mouseleave”事件.
在这里添加代码但是如果你访问下面的JSFiddle链接并将鼠标悬停在星形图标上,它实际上要简单得多.
$(document).ready(function () {
$(document).on('mouseenter','[id^=star-]',function () {
$('[id^=star-]').html('<span class="star star-empty"></span>');
}).on('mouseleave',function () {
$('[id^=star-]').html('<span class="star star-full"></span>');
});
});
请参阅JSFiddle here.只需将鼠标悬停在星形图标上即可看到我的意思.
解决方法
添加时,mouseleave事件有效
.star {
display: block;
}
在CSS中
更新：
使用Javascript：
$(document).ready(function () {
$('.rating').on('mouseenter','a[id^=star-]',function () {
console.log('Hello');
$(this).children('span').addClass('star-empty').removeClass('star-full');
}).on('mouseleave',function () {
console.log('leave');
$(this).children('span').addClass('star-full').removeClass('star-empty')
});
});
