2011-08-20 1 views
5

창이로드 된 후에 실행해야하는 javascript가 있지만 어떤 이유로 든 실행되지 않습니다.함수가 호출되지 않았습니다.

function setClasses(){ 
     document.getElementsByClassName("gchoice_35_0")[0].onclick = sedanShow; 
     document.getElementsByClassName("gchoice_22_0")[0].onclick = sedanShow; 
     document.getElementsByClassName("gchoice_34_0")[0].onclick = sedanShow; 

     document.getElementsByClassName("gchoice_34_1")[0].onclick = suvShow; 
     document.getElementsByClassName("gchoice_35_1")[0].onclick = suvShow; 
     document.getElementsByClassName("gchoice_22_1")[0].onclick = suvShow; 

     document.getElementsByClassName("gchoice_22_2")[0].onclick = vanShow; 
     document.getElementsByClassName("gchoice_35_2")[0].onclick = vanShow; 
     document.getElementsByClassName("gchoice_34_2")[0].onclick = vanShow; 
    } 

window.onload = setClasses; 

setClasses() 함수를 실행하지 않는 것 :

여기 내 코드입니다. 그것은 FireBug의 콘솔을 통해 수동으로 호출 할 때 작동합니다.

코드는 내 웹 페이지의 헤더에 있습니다.

도움을 주시면 감사하겠습니다.

<head> 
...... 

<script type="text/javascript"> 
function setClasses(){ 
     document.getElementsByClassName("gchoice_35_0")[0].onclick = sedanShow; 
     document.getElementsByClassName("gchoice_22_0")[0].onclick = sedanShow; 
     document.getElementsByClassName("gchoice_34_0")[0].onclick = sedanShow; 

     document.getElementsByClassName("gchoice_34_1")[0].onclick = suvShow; 
     document.getElementsByClassName("gchoice_35_1")[0].onclick = suvShow; 
     document.getElementsByClassName("gchoice_22_1")[0].onclick = suvShow; 

     document.getElementsByClassName("gchoice_22_2")[0].onclick = vanShow; 
     document.getElementsByClassName("gchoice_35_2")[0].onclick = vanShow; 
     document.getElementsByClassName("gchoice_34_2")[0].onclick = vanShow; 
    } 

    function sedanShow(){ 
      document.getElementById("sedan").style.display="inline" 
      document.getElementById("suv").style.display="none" 
      document.getElementById("van").style.display="none" 
     } 
     function suvShow(){ 
      document.getElementById("sedan").style.display="none" 
      document.getElementById("suv").style.display="inline" 
      document.getElementById("van").style.display="none" 
     } 
     function vanShow(){ 
      document.getElementById("sedan").style.display="none" 
      document.getElementById("suv").style.display="none" 
      document.getElementById("van").style.display="inline" 
     } 
    window.onload = setClasses; 
    </script> 

......

+3

이 경우이 코드가 페이지에 나타 납니까? 작동하지 않는 HTML 스 니펫 전체를 게시 하시겠습니까? –

+3

저는 setClasses가 실행되고 있다고 생각합니다. 문제는 아닙니다. setClasses 함수에 경고를두면 실행됩니다. 나는 아마 당신의 onclick 속성을 설정하는 방법이라고 생각합니다. IE는 문자열로 설정해야하며, Firefox는 함수로 설정해야합니다. JQuery와 YUI는 이벤트 유틸리티를 제공하여이를 완화합니다. 이러한 프레임 워크를 조사하는 것이 좋습니다. 왜냐하면 이러한 브라우저가 많은 브라우저 간결함을 줄이는 데 도움이되기 때문입니다. – Zoidberg

+0

이 코드를 덮어 쓰는 window.onload를 다른 것으로 설정 했습니까? – epascarello

답변

2

당신은 항상 JQuery와

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 

<script type="text/javascript"> 
     $(document).ready(function() { 
      setClasses(); 
     }); 
</script> 

편집

예 JQuery와 이벤트 리팩터링을 사용할 수

$(".gchoice_35_0").click(function(){ 
    //Handler Code... 
}); 
+0

Nice, JQuery 또한 매우 좋은 솔루션입니다. setClasses 메소드에서 Jquery 이벤트 처리를 보여줌으로써 답을 자세히 설명해 주시겠습니까? 나는 그것이 당신의 대답에 가치를 더할 것이라고 생각합니다. – Zoidberg

+0

훌륭한 API 참조 : http://api.jquery.com/click/ –

1

내가 그것을 사용 여부 주시기 YUI를 사용하는 대답을하기 위하여려고하고있다,하지만 난 프레임 워크가 생각 :

전체 HTML은 니펫을 좋은 아이디어는 자바 스크립트 개발 속도를 돕기 위해. (이것은 IE, 깜짝 깜짝 기발한 수 있기 때문에) 그래서,에 그런 수행 위해 window.onload = someFn 대신

<script type="text/javascript" src="http://yui.yahooapis.com/2.9.0/build/yahoo-dom-event/yahoo-dom-event.js"></script> 

그런 다음 페이지로 다음

YAHOO.util.Event.onDOMReady(function() { 
    setClasses(); 
}); 

을에서 다음을 추가하려면 클래스 기능을 설정하려면 다음을 수행하십시오.

function setClasses(){ 
     YAHOO.util.Event.on(document.getElementsByClassName("gchoice_35_0")[0], 'click', sedanShow); 
     YAHOO.util.Event.on(document.getElementsByClassName("gchoice_22_0")[0], 'click', sedanShow); 
     YAHOO.util.Event.on(document.getElementsByClassName("gchoice_34_0")[0], 'click', sedanShow); 

     YAHOO.util.Event.on(document.getElementsByClassName("gchoice_34_1")[0], 'click', suvShow); 
     YAHOO.util.Event.on(document.getElementsByClassName("gchoice_35_1")[0], 'click', suvShow); 
     YAHOO.util.Event.on(document.getElementsByClassName("gchoice_22_1")[0], 'click', suvShow); 

     YAHOO.util.Event.on(document.getElementsByClassName("gchoice_22_2")[0], 'click', vanShow); 
     YAHOO.util.Event.on(document.getElementsByClassName("gchoice_35_2")[0], 'click', vanShow); 
     YAHOO.util.Event.on(document.getElementsByClassName("gchoice_34_2")[0], 'click', vanShow); 
    } 

트릭을 수행해야합니다.