9
votes

Comment utiliser ONClick avec une expression de fonction plutôt qu'une fonction déclarée?

J'ai un bouton

startButton.onclick = start;

javascript onclick

1 commentaires

Hey Will, n'oubliez pas de marquer une réponse. :-)

3 Réponses :

2
votes

Je serais d'accord avec vous que c'est une question de levage, vous devrez examiner votre code pour le lever de manière appropriée avant de définir startbutton.onclick = début; . .

Voici ce que MDN a à dire à propos de La syntaxe:

Il mentionne spécifiquement que la fonction peut être déclarée ou exprimée. Qui, pour moi, conduit à nouveau à la hiérarchie, car les déclarations de fonction sont automatiquement hissées.

the MDN pour OnClick utilise une déclaration de fonction. J'ai changé l'exemple de ce jsfiddle pour utiliser une expression de fonction, comme vous le souhaitez utiliser. Avec un hélage correct, il appelle la méthode correcte lorsque vous cliquez sur le bouton.



                                                                    
                                    
                                    
                                        1 commentaires
                                        
                                                                                            
                                                    Merci Adam - ressemble beaucoup à celui déclaré est la meilleure façon d'aller sur ce


                        
                                            
                            
                                
                                    2
 votes
                                
                            
                            
                                
                                     Jugement par la description de votre problème, il semble que vous déclarez (et définissez)  Démarrer  code>  après  em> l'affectation à  startbutton.onclick  code>. Dans ce cas,  startbutton.onclick  code> sera effectivement  non défini  code>. 
 Qu'est-ce que la hélérité est la variable elle-même - votre code sait qu'il a été déclaré, mais ne connaît pas encore sa valeur, car la mission a lieu exactement où vous l'avez dans le code. Pensez-y de cette façon: lorsque vous utilisez le mot-clé  var  code>, vous déclarez une variable qui, cependant, n'est pas encore définie. Si vous vous arrivez immédiatement une valeur à cela, la nouvelle valeur n'est pas visible au code ci-dessus de l'affectation.  P> 
 Considérez l'exemple suivant:  P> 
startButton.onclick = function() { // I'm a function expression too!
    // do something here
}

                                

                                                                    
                                    
                                    
                                        0 commentaires
                                        
                                                                                    
                                    
                                                            
                        
                        
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     La pièce jointe de l'événement doit se produire après la création de l'expression de la fonction. 
 Checkout à propos de ce  exemple   P> 
<button id="click">Click</button>
<button id="click2">Click2</button>

$(function(){

  var startButton = $("#click").get(0);
  var startButton2 = $("#click2").get(0);

  startButton.onclick = clickFunc; // wont work

  var clickFunc = function() {
    alert('click');
  };

  startButton2.onclick = clickFunc; // work
});

                                

                                                                    
                                    
                                    
                                        0 commentaires