Jquery else不起作用

时间:2014-04-03 19:12:11

标签: jquery if-statement

广东话'使这个jquery正常工作:

$(".btn-0").click(function(){
    $('.btn-0').addClass('btn-success');
    $('.btn-1,.btn-2, .btn-3, .btn-4, .btn-7, .btn-10, .btn-13, .btn-16, .btn-19, .btn-22, .btn-25, .btn-28, .btn-31, .btn-34, .btn-37, .btn-40, .btn-43, .btn-46, .btn-49, .btn-52').removeClass('btn-success');
});

if ($('.btn-0').hasClass('btn-success')) {
    $('.option-1').addClass('green'); 
}
else {
    $('.option-1').removeClass('green');
}

这个想法是:如果btn-0有类btn-success,div选项-1接收类green ... 如果btn-1 / btn-2 / btn-3具有类btn-success,则div选项-2接收类绿色... 等。

HTML是:

 <div class="option-1 row">
    <div class="col-md-1"><span class=" badge-0">#</span></div>
    <div class="atividade col-md-8"><p>Painel – O cenário econômico brasileiro <span class="red">(60 minutos)</span></p>Bradesco
    </div>
    <div class="col-md-3"><a id="test" class="btn-0 btn btn-small btn-danger">9h30</a>
    </div>
  </div>
  <div class="option-2 row" >
   <div class="col-md-1"><span class=" badge-1">1</span></div>
   <div class="col-md-8"><p>A sucessão no negócio Bob’s. Como preparar os herdeiros para o sucesso?</p>  Valéria Ribeiro </div>
   <div class="col-md-3"><a class="btn-1 btn btn-small btn-danger">9h30</a> <a class="btn-2 btn btn-small btn-danger">10h15</a> <a class="btn-3 btn btn-small btn-danger">11h</a>
   </div>
 </div>
 <div class="option-3 row" >
   <div class="col-md-1"><span class=" badge-2">2</span></div>
   <div class="col-md-8"><p>Como identificar e negociar o ponto ideal </p>Sérgio Iunis</div>
   <div class="col-md-3"><a class="btn-4 btn btn-small btn-danger">9h30</a> <a class="btn-5 btn btn-small btn-danger">10h15</a> <a class="btn-6 btn btn-small btn-danger">11h</a>
   </div>
 </div>
 <div class="option-4 row">
  <div class="col-md-1"><span class=" badge-3">3</span></div>
  <div class="col-md-8"><p>O futuro dos meios de pagamento no varejo </p> Mastercard</div> 
  <div class="col-md-3"><a class="btn-7 btn btn-small btn-danger">9h30</a> <a class="btn-8 btn btn-small btn-danger">10h15</a> <a class="btn-9 btn btn-small btn-danger">11h</a>
  </div>
</div>

2 个答案:

答案 0 :(得分:1)

试试这个:

$(".btn-0").click(function(){
    $('.btn-0').addClass('btn-success');
    $('.btn-1,.btn-2, .btn-3, .btn-4, .btn-7, .btn-10, .btn-13, .btn-16, .btn-19, .btn-22, .btn-25, .btn-28, .btn-31, .btn-34, .btn-37, .btn-40, .btn-43, .btn-46, .btn-49, .btn-52').removeClass('btn-success');

if ($('.btn-0').hasClass('btn-success')) {
    $('.option-1').addClass('green'); 
}
else {
    $('.option-1').removeClass('green');
}
});

答案 1 :(得分:0)

我认为这是你想要的,但不是100%肯定

$(".btn").click(function(){
    var row = $(this).closest('.row');
    if( row.hasClass('btn-success') ) {
        row.removeClass('btn-success green');
    } else {
        row.addClass('btn-success green');
    }
});

演示:http://jsfiddle.net/pLdBU/