0

我必须检查 div 是否有 class='completed'，然后添加 Hello. 如果不是什么都不做。但是我写的代码是添加 Hello 即使 div 里面没有 class='completed' 。

jssfiddle 1 2 3

$(document).ready(function(){
  $( '#bar > div' ).each(function() { 
      if(($('.complete').length > 0)){
           var txt = $(this).find('.step-number').empty();
                     $(this).find('.step-number').after('<span class="hello">Hello</span>');
      }
  });
});
4

9 回答 9

1

只需使用hasClass：

确定任何匹配的元素是否分配给给定的类

于 2013-07-05T09:10:45.257 回答
1

只需替换此代码

if($('.complete').length > 0){

有了这个

if($(this).hasClass('complete')){

小提琴演示

实际上，在您的代码中

$('.complete').length

总是返回 value 2，因为你有两个元素与该类，因此$('.complete').length总是大于 0。因此，Hello即使 div 中没有 class='completed' ，它也会添加。

于 2013-07-05T09:10:48.497 回答
1

使用 jQuery 的hasClass("class-name").

于 2013-07-05T09:11:04.843 回答
0

尝试这个，

$(document).ready(function(){
  $( '#bar > div' ).each(function() { 
      if(($(this).hasClass('complete'))){
           var txt = $(this).find('.step-number').empty();
                     $(this).find('.step-number').after('<span class="hello">Hello</span>');
      }
  });
});
于 2013-07-05T09:11:41.373 回答
0

尝试hasClass

$(document).ready(function(){
  $( '#bar > div' ).each(function() { 
     if($(this).hasClass('complete')){
           var txt = $(this).find('.step-number').empty();
                     $(this).find('.step-number').after('<span  class="hello">Hello</span>');
      }
  });
});

工作演示

于 2013-07-05T09:12:00.770 回答
0

为此，您必须使用hasClass。

描述：确定是否为任何匹配的元素分配了给定的类。

例子：<div id="mydiv" class="foo bar"></div>

如果将类分配给一个元素，.hasClass() 方法将返回 true，即使其他类也是如此。例如，给定上面的 HTML，以下将返回 true：

$('#mydiv').hasClass('foo')

所以在你的代码中你应该使用if($(this).hasClass('complete')).

于 2013-07-05T09:12:27.093 回答
0

您还可以complete在选择器中指定为：

 $( '#bar > div.complete' ).each(function() { 
      var txt = $(this).find('.step-number').empty();
      $(this).find('.step-number').after('<span class="hello">Hello</span>');
  });
于 2013-07-05T09:12:55.993 回答
0

你甚至不需要.each，你可以使用:has()选择器。

$(document).ready(function(){
    $('#bar > div:has(.completed)')
      .find('.step-number')
      .empty()
      .after('<span class="hello">Hello</span>');
});
于 2013-07-05T09:13:10.390 回答
0

在if(($('.complete').length > 0))你没有检查特定的 div 是否有类.complete，而只是选择所有元素.complete。

您可以将循环更改为： $( '#bar > div' ).each(function(index, div) {...} 而不仅仅是检查.hasClass()div 是否具有所需的类。

于 2013-07-05T09:15:59.923 回答