2014-12-08 7 views
-1

그래서 여러 개의 확인란이있는이 스크립트가 있습니다 확인란을 선택하면 추가 단추를 보여주는 스크립트가 있습니다 그러나 스크립트는 첫 번째 확인란을 작동합니다 모든 체크 박스는 동일한 ID를 가진 반면 페이지. 체크 박스의jQuery 토글 div 첫 번째 확인란에만 작동합니다

하나 :

<input type="checkbox" id="checkstate" name="diritems[]" value=".snap" onclick="javascript:Toggle(this);"> 

스크립트 :

$(document).ready(function(){ 
$('#checkstate').change(function(){ 
    if ($('#checkstate').is(':checked')) 
     $('.addopt').fadeIn('Fast', 'linear'); 
    else 
     $('.addopt').fadeOut('Fast', 'linear'); 

});}); 

그래서 이것은 단지 페이지에있는 첫 번째 ID = "checkState에는"함께 첫 번째 체크 박스를 작동, 기타를 체크 박스는 아무 것도하지 않습니다.

+5

** ID ** 이름은 문서에서 고유해야합니다. [w3.org] (http://www.w3.org/TR/html401/struct/global.html#h-7.5. 2). – emmanuel

+0

다른 선택기를 사용해 보거나 (관련있는 경우 클래스를 사용하는 것이 좋음) 그렇지 않으면 ** 속성 **을 추가하고 대신에 선택하십시오. – jbutler483

답변

4

이드 페이지에서 고유해야 (P.S. togglethis는 작업을 수행하는 별도의 함수이다). 동일한 ID를 가진 여러 요소를 찾으려고하면 첫 번째 요소 만 가져옵니다. 수

$('.checkstate').change(function(){ 
    ... 
+0

Offcourse Offcourse는 ID 대신 클래스 여야합니다. 추측하지 못해서 너무 오랫동안 작업 해 왔습니다. 감사합니다! – Sjef92

+0

다른 스크립트에서 확인란을 선택하면 어떻게됩니까? TD를 누르면 확인란을 선택하지만 스크립트는 실행되지 않습니다. – Sjef92

+0

@ Sjef92 : 스크립트에 의한 변경은 이벤트를 트리거하지 않지만 jQuery'trigger' 메소드를 사용하여 스크립트에서 이벤트를 트리거 할 수 있습니다. – Guffa

0

당신은 (그들을 대상으로 클래스를 사용할 필요가 또는 다른 선택은 할 수 : 이제 당신이 그들 모두를 찾을 수 있습니다

<input type="checkbox" class="checkstate" name="diritems[]" value=".snap" onclick="javascript:Toggle(this);"> 

:

대신 체크 박스에 대한 클래스를 사용하여 여러 요소에 적용
) 키워드를 사용하여 실제 클릭 된 요소를 타겟팅하십시오.

$(document).ready(function() { 
    $('.checkstate').change(function() { 
     if (this.checked) { 
      $('.addopt').fadeIn('Fast', 'linear'); 
     } else { 
      $('.addopt').fadeOut('Fast', 'linear'); 
     } 

    }); 
}); 
관련 문제