我有这个HTML:
<div class="post-content">
I have something to give away for free. Call
<span class="togglers">
<a class="toggler selected" href="#" title="change" style="display: inline;">me</a>
<span class="divider" style="display: inline;">|</span>
<a class="toggler" href="#" title="change" style="display: inline;">us</a>
</span>
today and
<span class="togglers">
<a class="toggler" href="#" title="change" style="display: inline;">I'll</a>
<span class="divider" style="display: inline;">|</span>
<a class="toggler" href="#" title="change" style="display: inline;">we'll</a>
</span>
hand deliver it to your doorstep.
</div>
所以它看起来像这样:
I have something to give away for free. Call [me|us] today and [I'll|we'll] hand deliver it to your doorstep.
然后用户可以选择“我”或“我们”,“我会”或“我们会”。一旦他们从每个组中选择一个单词,该单词的包含就会有一个“选定”的类。但是,我想只在每个span.togglers都有一个a.selected时做一些事情。我担心我已经找到了Javascript答案,但我不太了解Javascript以了解它是如何工作的。我怎么能用jQuery做到这一点?或者,我是否必须使用Javascript执行此操作?
答案 0 :(得分:1)
如果您想要删除没有“选定”类的元素,只需使用jQuery:
$(".toggler").each(function(){
if(!this.hasClass('selected')){
this.remove();
}
});
答案 1 :(得分:1)
要检查每个togglers
是否有a.selected
,您可以执行此操作:
if ($('.togglers').length == $('.toggler.selected').length) {
$(".toggler:not('.selected')").remove(); //removes all .toggler tags that don't have the .selected class
}
(我在此假设您的代码确保每.toggler
只有一个.selected
.togglers
,否则您必须修改代码以检查每个.togglers
单独地)