2017-02-17 3 views
2

私は9 divを持っています。私は各divをクリックすると "アクティブ"クラスを追加します。私は3つのdivをクリックした後にクラスを削除するには?

<section class="square_box tctgrid" id="question1"> 
    <div></div> 
    <div></div> 
    <div></div> 
    <div class="empty"><input type="radio" value="1" class="answer_value"></div> 
    <div></div> 
    <div></div> 
    <div></div> 
    <div></div> 
    <div></div> 

第四

<script> 
$(".square_box div").click(function() { 
    if ($(this).hasClass("empty")) { 
     var ans = $(this).find('.answer_value').val(); 
     $(this).addClass("active"); 
    } 
    else{ 
     $(this).addClass("active").addClass('error_div');; 
    } 
}); 
</script> 

上記のコードは私のスクリプトであるとして、DIVのいずれかをクリックしたとき、私はその「アクティブ」クラスを削除する必要があります。私はクラスを取り除く方法を知らない。私にこれを助けてください。

+0

を4番目のものがクリックされたら? – Varun

答えて

4

はこのような何か試してみてくださいそれを行うことができます:あなたはすべてのdivのクラス `active`を削除する必要があり

$(document).ready(function() { 
    $("div").each(function() { 
    $(this).data('count', 0); 
    } 
    $("div").click(function() { 
    $(this).data('count', ($(this).data('count') +1)); 
    if($(this).data('count') == 4) { 
     $("div").removeClass("active"); 
     $(this).data('count', 0); 
    } 
    }); 
}); 
1

あなたが正しく理解している場合は、これがあなたの要求を解決するはずです。

$(".square_box div").click(function() { 
    $(".square_box div .active").removeClass("active"); 
    //handle the rest of you methods 
}); 
0

あなたはこのよう

$(document).ready(function(){ 
 
    $("div").click(function(){ 
 
    $("div").removeClass("active"); 
 
    $(this).addClass("active"); 
 
    }); 
 
});
div{ 
 
    cursor:pointer 
 
} 
 
.active{ 
 
    font-weight:bold 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div></div> 
 
    <div>ONE</div> 
 
    <div>TWO</div> 
 
    <div>THREE</div> 
 
    <div>FOUR</div> 
 
    <div>FIVE</div> 
 
    <div>SIX</div> 
 
    <div>SEVEN</div> 
 
    <div>EIGHT</div>

+0

4回目にdivをクリックすると、クラスを削除する必要があります。 – user7393779

関連する問題