jQuery替换类
jQuery替换类
提问于 2012-09-03 03:03:32
我有一个很大的<li>列表，它们是从'span3‘类中获得宽度的。
<ul class="thumbnails">
<li class="span3">
<div class="thumbnail"><img src="/images/logos-s/s-001.png" alt="" data-creator="swc"> <span>01</span></div>
</li>
repeat...40x
</ul>我有按钮(button#grid-bigger && button#grid-smaller)，允许用户增加和减少点击网格的大小。理想情况下，用户可以单击三次，每次都会将<li>类从span3更改为span4，然后更改为span12。
下面是JavaScript：
$('#grid-bigger').live('click', function (e) {
$('#blob .thumbnails').find('li').each(function(i, ojb) {
if ( $(this).hasClass('span2') ) {
$(this).removeClass('span2').addClass('span3');
}
if ( $(this).hasClass('span3') ) {
$(this).removeClass('span3').addClass('span4');
}
if ( $(this).hasClass('span4') ) {
$(this).removeClass('span4').addClass('span12');
}
});
});发生的情况是，不是允许单独单击"make bigger“按钮，而是只单击一次，并同时执行两个语句。
有什么建议吗？
回答 1
Stack Overflow用户
回答已采纳
发布于 2012-09-03 03:05:59
您只需要使用else if，否则它们将按顺序执行：
if ( $(this).hasClass('span2') ) {
$(this).removeClass('span2').addClass('span3');
} else if ( $(this).hasClass('span3') ) {
$(this).removeClass('span3').addClass('span4');
} else if ( $(this).hasClass('span4') ) {
$(this).removeClass('span4').addClass('span12');
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12238884
复制相关文章
相似问题