jQuery：hasClass部分匹配

Question

使用Attribute Contains Word Selector時是否應該評估爲true？我試圖在if/else語句中使用它，如下所示，它不計算爲真。

<li class="orange blue"> 
    <div class="answer">Some Content</div> 
</li> 
<input type="button" name="yellow" value="yellow" class="yellow" /> 
<br /> 
<input type="text" value="" class="result" /> 

$("input.yellow").click(function() { 
    if ($("div.answer").parent().hasClass($("[class~='bl']")) == true){ 
     $("input.result").val("has class"); 
    } else { 
     $("div.answer").parent().addClass("blue"); 
     $("input.result").val("class added") 
    }; 
}); 

The fiddle

Answer 1

正如評論建議，hasClass發生在一個string。所以你可以使用is： -

if ($("div.answer").parent().is($("[class~='bl']"))){ 

，或者你可以創建一個小的jQuery插件： -

$.fn.hasPartialClass = function(partial){ 
    return new RegExp(partial).test(this.prop('class')); 
}; 

和使用，如： -

if ($("div.answer").parent().hasPartialClass("bl")){ 

Answer 2

你忘了你使用的是「屬性包含字選擇器」 因此，這個選擇器要匹配，你必須使用[class~='blue']。 您不能使用[class~='bl']，因爲class屬性不包含單詞'bl'，而是單詞'blue'。

使用這種選擇方式：

$("input.yellow").click(function() { 
    if ($("div.answer").parent().is("[class~='blue']")){ 
     $("input.result").val("has class"); 
    } else { 
     $("div.answer").parent().addClass("blue"); 
     $("input.result").val("class added") 
    }; 
});