확인란을 선택하십시오. div의 토글 클래스 (같은 div가 여러 개임)

Question

div 목록 (# div1, # div2, # div3 등)이 있습니다. 각 div에는 서로 다른 그림과 질감이 포함되어 있습니다. div는 동일한 레이아웃 클래스를 공유하며 모두 체크 박스를 포함합니다 (모든 체크 박스에도 하나의 클래스가 있음).

개별 div가 체크 박스를 선택하면 클래스를 토글하게하고 싶습니다.

하나의 div에서 체크 박스를 클릭하면 모든 div 토글 클래스를 관리하지 않고이를 관리하는 방법은 무엇입니까?

감사합니다.

Answer 1

시도해보십시오. DEMO.

확인란에 .click()을 사용하고 .parent()을 사용하여 상위 div를 가져온 다음 .toggleClass('classforparentdiv')으로 전화하십시오.

UPDATE

Here.

희망이 있습니다.

Answer 2

http://jsbin.com/exasow/1/edit

$(':checkbox').click(function(){ 
    $(this).closest('div[id^=div]').toggleClass('superclass'); 
}); 

당신은 모두 click 또는 change 기능을 사용할 수 있습니다.

http://api.jquery.com/closest/ 것은, 항상 원하는 부모의 DOM 트리를 검색합니다 다른 요소 안에 당신의 체크 박스를 할 수 있습니다 :

div[id^=div]이 DIV element which ID starts with the word "div"를 의미하며 모든 div1, div2, div*** 선택기 작동합니다.

Answer 3

클래스

을 부모 DIV를 전환하거나, 이벤트를 듣고이 같은

뭔가 부모 DIV의 클래스를 전환 확인란에 그 기초에 아이디를 부여,

$ (event.currentTarget) .parent(). toggle ('className');