2011-11-04 8 views
5
1| <script type="text/javascript"> 
2| function more() { 
3|   $("#innerSub2").animate({ scrollTop: "+=240px" },1000); 
4|   var count = 1; 
5|   document.getElementById("dot" +count).style.color="#c7c9e9"; 
6|   var count = count + 1; 
7|   document.getElementById("dot" +count).style.color="#6464c1"; 
8|  } 
9|  </script> 

Helo, sono piuttosto nuovo per javascript. Mi dispiace se questa è una domanda stupida.
Sul primo evento click la variabile funziona come ho bisogno di (riga 5, count = 1) (riga 7, count = 2)
Ma sull'evento secondo clic di cui ho bisogno (riga 5, count = 2) (riga 7, count = 3) ma come potete vedere si resetta a 1 con la riga 4.
Quindi la domanda è, come posso dichiarare | var count = 1; | al di fuori della funzione more() quindi non resetterà la mia variabile? o se c'è qualche altro modo per fare questo ..
anche se c'è un modo per fermare conteggio variabile da superiore a 3, si prega di condividere
GrazieVariabile Javascript al di fuori della funzione?

risposta

3

È possibile definire una variabile di fuori della funzione, così non ci vorrà essere cancellati, in questo modo l'ambito della variabile sarà globale, avendo un sacco di variabili globali è considerato di non essere una buona pratica si può imparare di più su portata e JavaScript/basi jQuery in questo libro http://jqfundamentals.com/book/index.html#example-2.44

<script type="text/javascript"> 
    var count = 1; 
    function more() { 
     $("#innerSub2").animate({ scrollTop: "+=240px" },1000);   
     document.getElementById("dot" +count).style.color="#c7c9e9"; 
     count = count + 1; //removed the var word. 
     document.getElementById("dot" +count).style.color="#6464c1"; 
     } 
</script> 
+2

Probabilmente sarebbe meglio avvolgere il codice in una funzione autoesposta per prevenire l'inquinamento globale. Un'altra alternativa sarebbe definire 'move.count = 1' invece di contare, e lavorare solo sulla variabile globale' more() 'già definita. – William

+0

Grazie! Ho provato a mettere "var count = 1;" funzione precedente ma all'interno della funzione ho avuto "var count = count + 1;" ecco perché non funzionava. eliminare "var" ha fatto il trucco. Grazie ragazzi – iamruskie

+0

Sono contento che abbia funzionato !!! non smettere di imparare il libro che ho condiviso con te è davvero utile per imparare le basi per favore dai un'occhiata e per favore segna questa domanda come risposta le regole del sito dicono così http: // StackOverflow.com/faq # howtoask "Questo permette ad altre persone di sapere che hai ricevuto una buona risposta alla tua domanda.Questo è utile perché mostra ad altre persone che stai ottenendo valore dalla comunità. (E se non lo fai , le persone ti chiedono cortesemente di tornare indietro e accettare le risposte per altre tue domande!) " – ElHacker

0

Esattamente come hai scritto

var count = 1; 
    function more() { 
      $("#innerSub2").animate({ scrollTop: "+=240px" },1000); 
      document.getElementById("dot" +count).style.color="#c7c9e9"; 
      count = (count>2)?3:(count+1); 
      document.getElementById("dot" +count).style.color="#6464c1"; 
    } 
0
var count = 1; 
function more(count) { 
      $("#innerSub2").animate({ scrollTop: "+=240px" },1000); 
      document.getElementById("dot" +count).style.color="#c7c9e9"; 

      if(count < 3) 
       count += 1; 

      document.getElementById("dot" +count).style.color="#6464c1"; 

      return count; 
    } 



    then you just call more(count) on some event. 
+1

solo per curiosità, perché mixare jquery e straight js? document.getElementById ("punto" + count) .style.color = "# c7c9e9"; dovrebbe essere solo $ ('# dot' + count) .css ('color', 'c7c9e9') –

0

Dal momento che il var è funzione all'interno, e si sta impostando a = 1, sarà sempre 'reset' a 1. Quello che dovete fare è:

var count = 1; 
function more(){ 
    //js stuff animate 
    count = count+1; 
    //other js css 
    count = count+1; 
    //another js color 
} 

Si tratta di usare i tuoi struttura. Si desidera interrompere il conteggio dopo 3 ma gli altri js continuano a funzionare o anche js smette di funzionare? Facciamo entrambi come esempio. 3 ma js funzionano ancora:

var count = 1; 
function more(){ 
    //js stuff animate 
    if(count<3){count = count+1;} 
    //other js css 
    if(count<3){count = count+1;} 
    //another js color 
} 

se si desidera che tutti smettono di funzionare, allora:

var count = 1; 
function more(){ 
    if(count<3){ 
     //js stuff animate 
     count = count+1; 
     //other js css 
     count = count+1; 
     //another js color 
    } 
} 

Ci sono migliori sotto forma di presentazione, ma ho usato la struttura del codice di modo che tu possa capire meglio.

Se a volte è necessario reimpostare il conteggio nella stessa pagina, poiché la variabile è esterna alla funzione, è una variabile globale in modo che altre funzioni possano accedere/modificare. Ad es.

0

Inoltre, per aggiungere alla risposta di Syred, è necessario inserire qualche errore nel controllo delle chiamate dell'oggetto DOM. Per esempio:

<script type="text/javascript"> 
    var count = 1; 
    function more() { 
     $("#innerSub2").animate({ scrollTop: "+=240px" },1000); 
     if (document.getElementById("dot" + count) != null) { 
      document.getElementById("dot" +count).style.color="#c7c9e9"; 
      count = count + 1; //removed the var word. (could also use count++) 
      if (document.getElementById("dot" + count) != null) 
       document.getElementById("dot" +count).style.color="#6464c1"; 
     } 
    } 
</script> 

Se sapessi di più su come si stava utilizzando la funzione, potrei fare altre raccomandazioni su come semplificare e controllare gli errori, ma questo dovrebbe darvi una buona idea.

Problemi correlati