1

对于某些人来说,这个问题似乎并不清楚。

想要的效果:

删除将鼠标悬停在其上的元素的类。

问题:

即使我使用 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)

这些行动都没有解决问题。

4

0 回答 0