2017-05-13 14 views
0

HTMLのonClickは、divタグ内のdiv

<div class="perWatchVideo" id="remove"> 
     <div class="controls"> 
      <input type="link" id="link" name="link" placeholder="Place Link here" class="linkInput"> 
      <button class="btn btn-primary loadVideo">Load Video!</button> 
     </div> 
    </div> 
jquery 
    $(document).ready(function(){ 
     $("loadVideo").click(function(){ 
      $("#remove").removeClass("preWachVideo"); 
     }); 
    }); 

からクラスを削除し、私はperWatchVideoというクラスを作成しました。ボタンをクリックすると、このクラスを取り除き、別のクラスであるpostWatchVideoクラスに置き換えたいと考えています。どのようにjQueryでこれを行うことができますか?

答えて

1

あなたはあなたが.addClass()

$(document).ready(function(){ 
    $(".loadVideo").click(function(){ 
     $("#remove").removeClass("preWachVideo").addClass('postWatchVideo'); 
    }); 
}); 

か、各クリックで授業を切り替える必要がある場合は、toggleClass();

を使用することができますを使用する必要がある代わりに $("loadVideo")

$(".loadVideo")するloadVideo.を忘れてしまったまず第一に

$(document).ready(function(){ 
    $(".loadVideo").click(function(){ 
     $("#remove").toggleClass("preWachVideo postWatchVideo"); 
    }); 
}); 

注:id="remove"あなたのコードは、単に最初の#remove element

で動作しますし、あなたが複数の要素を持っている場合はIDが一意すると仮定ので、あなたはに

<div class="perWatchVideo" id="remove"> 

からそれを変更する必要があります

<div class="perWatchVideo remove"> 

その後、あなたのコードは、この

のように見えるはずです3210
$(document).ready(function(){ 
    $(".loadVideo").click(function(){ 
     $(this).closest(".remove").removeClass("preWachVideo").addClass('postWatchVideo'); 
    }); 
});