Jquery如果元素有以x开头的类，那么不要添加类

我是一个明确的新手，所以对垃圾编码表示歉意！我为自己设定的练习项目编写了以下jQuery：Jquery如果元素有以x开头的类，那么不要添加类

当您点击div时，它添加了类“in_answerbox1”，并在类answerbox_letter1的answerbox中创建了一个克隆的div，添加。

最终会有一个网格许多申报单（或细胞的表），当你点击一个特定的一个，它会淡出，似乎出现在answerbox。然后，当您单击答案框中的内容时，网格中的相关div将重新出现，克隆将从答案框中移除。

但是，现在我希望只在我点击的东西不在应答箱中时才添加该类：即，如果原始文件或克隆的某个类中包含“answerbox”。

我写了下面知道它不会工作，但它可能解释什么，我想要更好。

var n = 0; 

$('#box').click(function(){ 

    if(!$(this).hasClass('*[class^="answerbox"]')) { 

    $(this).addClass('in_answerbox' + (n+ 1)); 

    $(this).clone().appendTo('#answerbox').addClass('answerbox_letter' + (n + 1)); 
    n = (n + 1); 

} 


});

有什么建议吗？

来源

2013-04-23 Truvia

我觉得这个问题是如果条件：

if(!$(this).hasClass('[class^="answerbox"]')) {

试试这个：

if(!$(this).is('[class*="answerbox"]')) { 
    //Finds element with no answerbox class 
} else { 
    //The element has already an answerbox class 
}

你应该toggleClass和is jQuery的文档看看。

看到这个live fiddle example。

小提示：如果不n = (n + 1)你可以做n++ :)。

编辑：

再次读取的问题后，我做了一个full working script：

假设的Html是：

<div id="box"> 
    <p>Answer1</p> 
    <p>Answer2</p> 
    <p>Answer3</p> 
</div> 

<div id="answerbox"> 

</div>

jQuery的：

var n = 0; 

$('#box p').on('click',function(e) { 
    e.preventDefault(); 
    if(!$(this).is('[class*="answerbox"]')) { 
     n++; 
     $(this).addClass('in_answerbox' + n); 
     $(this).clone().appendTo('#answerbox').addClass('answerbox_letter' + n); 
    } 
});

看到这个example here。

你应该考虑使用data-attributes，他们会更可靠，然后classes为你想要做的。

需要注意的是，如果你想选择匹配只有class属性开始一个字，你会想[class^="word"]。然而，*搜索整个班级属性。要小心，[class^="word"]不会匹配<div class="test word">see here。

来源

2013-04-23 09:03:31 soyuka

这将试图找到元素给定的选择器在DOM树中的当前元素下面，不包括当前元素。但OP想检查给定类的当前元素 – devnull69 2013-04-23 09:06:15

感谢更正，误读了问题 – soyuka 2013-04-23 09:22:13

感谢您的提示！是的，我确实希望它检查给定类的当前元素。 – Truvia 2013-04-23 12:13:32

使用.is()而不是.hasClass()。前者可以与CSS选择器一起使用，而后者只能将类名称用作“固定”字符串。

if(!$(this).is('[class^="answerbox"]'))

注：如果元素恰好这只会持续工作一类

来源

2013-04-23 09:07:43 devnull69

你是怎么说的？如果元素只有一个类，这只会一致地工作。我做了一点[测试]（http://jsfiddle.net/qTyJU/1），但无法理解。 – soyuka 2013-04-23 10:00:35

如果你有多个类，当且仅当列表中的第一个类名以“answerbox”开始时，如果你有多个类，上述的.is（）的选择器才能工作。如果您正在查找的类名不是第一个，那么选择器将无法正常工作 – devnull69 2013-04-23 11:02:53

好吧，现在我明白了，但它似乎可以与'* ='选择器一起工作。 – soyuka 2013-04-23 11:58:30

如果你需要的东西，多类名的作品，看看这个

var theClasses = $(this).attr('class').split(" "); 
var i=0; 
var found = false; 
while(i<theClasses.length && !found) { 
    if(theClasses[i].indexOf('answerbox') == 0) { // starts with answerbox 
     found = true; 
    } 
    i++; 
} 
if(!found) { 
    // the current element does not have a class starting with answerbox 
}

来源

2013-04-23 11:06:56 devnull69

谢谢你，我会看看我能否得到它的工作！ – Truvia 2013-04-23 12:11:53

Jquery如果元素有以x开头的类，那么不要添加类

回答

相关问题