Question

此代码段用于删除现有类，在添加新类之前，直接指定它（即'ratingBlock'，'ratingBlock1'，'ratingBlock2'等）。但是当我在removeClass（'[class ^ =“ratingBlock”]'）中使用通配符选择器时，它不起作用。难道我做错了什么？感谢。

<style type="text/css">
.ratingBlock {background:gold !important;}
.ratingBlock1, .ratingBlock2, .ratingBlock3, .ratingBlock4, .ratingBlock5 {background:LightGreen;}
</style>

<div class="test block ratingBlock">
Broken
<div><a href="#" class="ratingLink ratingNo-1">1+</a></div>
<div><a href="#" class="ratingLink ratingNo-2">2+</a></div>
<div><a href="#" class="ratingLink ratingNo-3">3+</a></div>
</div>

<script type="text/javascript">
// <![CDATA[
jQuery(document).ready(function(){
    initRatingWorks();
});

function initRatingWorks() {
    jQuery("a.ratingLink").bind('click', function() {
      var star = jQuery(this);
      var ratingBlock = star.parents('div.test.block');
      var rating = star.attr('class').match(/\d+/);

      if (ratingBlock.attr('class').indexOf('ratingBlock') !== -1) {
          ratingBlock.removeClass('[class^="ratingBlock"]').addClass('ratingBlock' + rating);
      }
      else {
          ratingBlock.addClass('ratingBlock' + rating);
      }

      return false;
    });
}
// ]]>
</script>

Answer 1

$.removeClass()不将选择器作为参数，只接受类名（或类名）。

请参阅：Removing multiple classes (jQuery)

所以你基本上需要打电话：

$.removeClass('ratingBlock1 ratingBlock2 ratingBlock3 ratingBlock4 ratingBlock5');

Answer 2

removeClass采用函数或类名。您正在尝试提供css选择器。看起来你只需要：

ratingBlock.removeClass('ratingBlock').addClass('ratingBlock' + rating)

此外，你可以删除这样的通配符：

ratingBlock.removeClass (function (index, css) {
    return (css.match (/ratingBlock/g) || []).join(' ');
});

参考：JQuery removeClass wildcard

Answer 3

如果它变得更容易，我wrote a plugin for another answer将剥离以匹配开始（或结束）的类，所以

ratingBlock.stripClass('ratingBlock-').addClass('ratingBlock-' + rating);

将删除ratingBlock-1和ratingBlock-2，但不会删除ratingBlock（只要包含短划线）。

代码：https://gist.github.com/zaus/6734731

Answer 4

我认为你的问题是引号：我认为你不需要它们，试着省略它们。

'[class^=ratingBlock]'

修改

.removeClass()接受类名，而不是选择器。

但是，您可以指定多个以空格分隔的类名，因此可以尝试：

.removeClass('ratingBlock ratingBlock1 ratingBlock2');

http://api.jquery.com/removeClass/

jQuery：removeClass中的通配符类选择器

4 个答案: