Funzione non chiamata

Ho qualche javascript che dovrebbe essere eseguito dopo il caricamento della finestra, ma per qualche motivo, non viene mai eseguito.Funzione non chiamata

Ecco il mio codice:

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;

La funzione setClasses() non sembra funzionare. Funziona comunque quando lo chiamo manualmente attraverso la console di FireBug.

Il codice è inserito nell'intestazione della mia pagina web.

Qualsiasi aiuto è apprezzato.

snippet HTML completo:

<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>

......

fonte

2011-08-20 shahmeer navid

dove viene questo codice visualizzato nella pagina? Ti dispiace postare uno snippet HTML completo che non funziona? –

Credo che setClasses sia in esecuzione, non è questo il problema. Scommetto che se metti un avviso nella funzione setClasses, sparerà. Credo che sia probabilmente la tua impostazione della proprietà onclick. IE richiede che sia impostato come una stringa, mentre firefox richiede che sia una funzione. JQuery e YUI aiutano a mitigare questo offrendo utilità per gli eventi. Consiglierei di esaminare questi framework perché aiutano a ridurre un sacco di stranezze da browser che devi affrontare. – Zoidberg

C'è qualcos'altro che imposta window.onload che sta sovrascrivendo questo codice? – epascarello

Si può sempre utilizzare 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>

Modifica

Esempio JQuery evento Refactor:

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

fonte

2011-08-20 11:54:31

Nice, JQuery è anche un'ottima soluzione, potresti elaborare la tua risposta mostrando la gestione degli eventi di Jquery nel metodo setClasses? Penso che aggiungerebbe un certo valore alla tua risposta. – Zoidberg

Un riferimento api eccellente: http://api.jquery.com/click/ –

ho intenzione di dare una risposta che utilizza YUI, sentitevi liberi di utilizzare o meno, ma credo che i quadri sono una buona idea per velocizzare lo sviluppo di javascript. Quindi, aggiungere il seguente alla tua pagina

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

Allora, invece di window.onload = someFn (perché questo può essere eccentrico in IE, sorpresa sorpresa), effettuare le seguenti operazioni

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

Poi, nel tuo imposta la funzione classes, fai quanto segue

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); 
    }

Questo dovrebbe fare il trucco.

fonte

2011-08-20 11:52:21 Zoidberg

risposta

Problemi correlati