Question

我需要什么：

我需要像＆＃34;切换图像＆＃34;使用函数添加＆amp;删除jquery中的类。

JavaScript代码

$('.hover12').click(function () {
  $('.fa-star-o').removeClass('fa-star-o').addClass('fa-star orange12');
});

HTML代码

<a href="javascript:void(0);" class="hover12">
  <i class="fa fa-star-o favourate_dextop" title="Add to Favorites" id="fav13039" data-sess_id="13039" data-name="MAGIC" data-city="Las Vegas" data-country="United States Of America" data-event_url="magic"></i>
</a>

问题：

在第一次单击时，删除类工作正常，并将类添加到该特定类。
然后我在第二次点击时遇到问题，既不删除也不添加课程。

第一次切换时

o / p

<i class="fa favourate_dextop fa-star orange12" title="Add to Favorites" id="fav13039" data-sess_id="13039" data-name="MAGIC" data-city="Las Vegas" data-country="United States Of America" data-event_url="magic"></i>

我发现的解决方案：

$('.hover12').click(function () { 
  $('.fa-star').removeClass('fa-star orange12').addClass('fa-star-o');
});

Answer 1

更改此

  $('.fa-star-o').RemoveClass...

到这个

   $(this).find('i').RemoveClass...

Answer 2

试试这个：

$('.hover12').click(function() 
   {
            $(this).find('.fa').toggleClass('fa-star-o').toggleClass('fa-star orange12');
        });

Answer 3

选择器第二次失败为.fa-star-o类，因为没有类似的类，因为它在第一次单击时被删除了。

＆＃13;

$('.hover12').click(function(e){
  e.preventDefault();
  if($('.hover12 i').hasClass('fa-star-o')){
    $('.fa-star-o').removeClass('fa-star-o').addClass('fa-star orange12');
  }else if($('.hover12 i').hasClass('fa-star'){
    $('.fa-star-o').removeClass('fa-star orange12').addClass('fa-star-o');
  }
   
});

＆＃13;

这是一个丑陋的解决方案！

删除和添加类在jquery中不起作用

3 个答案: