对于某些人来说,这个问题似乎并不清楚。
想要的效果:
删除将鼠标悬停在其上的元素的类。
问题:
即使我使用 jQuery(this) 指向元素,类删除也会影响具有相同类的所有元素。
我有以下html:
<div id="stars_rater">
<span class="wp-svg-star star rater" id = "rater_1"></span>
<span class="wp-svg-star star rater" id = "rater_2"></span>
<span class="wp-svg-star star rater" id = "rater_3"></span>
<span class="wp-svg-star star rater" id = "rater_4"></span>
<span class="wp-svg-star star rater" id = "rater_5"></span>
</div>
而这个jQuery:
if(jQuery('#stars_rater').length > 0)
{
jQuery('.rater').on('mousemove', function(e)
{
var parentOffset = jQuery(this).offset();
var relX = e.pageX - parentOffset.left;
var number = Number(jQuery(this).attr('id').substring(6));
var current_id = jQuery(this).attr('id');
rating = 0;
if(relX < (jQuery(this).width()/2))
{
rating = ((number-1)+0.5);
// jQuery(this).removeClass();
jQuery(this).addClass('wp-svg-star-1');
jQuery(this).addClass('star-1');
}
});
}
一切正常,直到我到达评论行。移除类和以下操作应用于所有具有类 .rater 的元素,而不是应用于 jQuery(this)。
如果我删除此行,脚本将按预期工作。
我尝试过的关于冲突线的事情:
jQuery('#rater_'number).removeClass('class','');
jQuery(this).attr('class','');
我尝试以不同方式附加事件的事情
jQuery('#rater_1, #rater_2, #rater_3, #rater_4, #rater_5').on('mousemove', function(e)
这些行动都没有解决问题。