2011-03-07 113 views
1

我以前使用过hasClass方法,但我有一个场景,报告为不存在,但如果我输出元素.html()它清楚地显示该类正在使用项目以及其他类。jquery hasClass给出了错误的结果

该类所属的元素也被动态写入屏幕。任何想法我做错了什么?

$('.myList').each(function (index, item) { 

    // Check marked as complete 
    if (!$(item).hasClass('complete')) { 
     // Not complete 
     alert('not complete!' + $(item).html()); 

     completeFlag = false; 
     return false; 
    } 

}); 

的HTML输出:

<li id="myid" class="class1 class2 complete">some text</li> 
+2

你能告诉你的动态生成html? – coder 2011-03-07 15:36:14

+1

你没有提供任何信息。我们没有看到任何产生问题的标记或代码,也没有显示任何您提到的.html()输出。我们没有看到上下文或执行顺序能够以任何方式帮助您。 – JAAulde 2011-03-07 15:37:45

+1

*“任何想法我做错了吗?”*是:不引用标记,或显示您提到的.html()结果。 'hasClass'起作用,所以在你的情况中有一些具体的东西是你误解了或者是导致了不正当行为,但是我们甚至不能开始猜测它会是什么。 – 2011-03-07 15:41:34

回答

3

我猜你正在检查列表,你的意思是检查列表项目

什么,我认为你做

例子:

HTML:

<ul class="myList"> 
    <li>This is not complete</li> 
    <li>Nor this</li> 
    <li class="class1 class2 complete">But this is</li> 
    <li>And this isn't</li> 
</ul> 

的JavaScript:

$('.myList').each(function (index, item) { 

    // Check marked as complete 
    if (!$(item).hasClass('complete')) { 
     // Not complete 
     display('Item not complete: ' + $(item).html()); 
    } 
    else { 
     // Is complete 
     display('Item IS complete: ' + $(item).html()); 
    } 

}); 

Live copy(不工作)

这里是如何你会检查项目:更改

$('.myList').each(function (index, item) { 

到:

$('.myList li').each(function (index, item) { 
//   ^--- Note that we're now looping the 
// list *items*, not the list 

Live copy

+1

注意我瞄准的是列表类而不是项目。这是大多数努力的答案,如答案所示,谢谢。其中一个愚蠢的错误,我想太多了:) – Andrew 2011-03-07 16:09:21

2

.hasClass()检查您的选择相匹配的特定元素。你似乎认为它在元素内部搜索以查看该类是否在那里使用。这不是它的工作原理。

+2

绝对正确。显示$(item).html()只显示元素包含的标记,而不是元素的标记。在某些浏览器中,存在一个名为outerHTML的属性,它将向您显示所讨论的元素。但是。html()只返回元素的innerHTML值。 – JAAulde 2011-03-07 15:41:16

1

是不是你的html中的子元素中的一个元素有类但实际项目本身不是?我相信.hasClass()只决定实际元素本身是否应用了css类。