Uncaught ReferenceError: (function) is not defined at HTMLButtonElement.onclick

Résolu
Codeur_du_Dimanche Messages postés 2 Date d'inscription   Statut Membre Dernière intervention   -  
jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   -
Bonjour, j'ai un problème avec mon code html/js , j'ai un bouton qui doit activer une fonction :
<button id="startbut" onclick="move()" class="startbut">Start</button>
<script type="text/javascript">
function move(){console.log([starting]);}
</script>

Mais quand je clique sur le bouton j'ai un message d'erreur:
Uncaught ReferenceError: move is not defined at HTMLButtonElement.onclick

Configuration: Windows / Chrome 77.0.3865.120

3 réponses

  1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Ton code est bourré d'erreurs....
    Des accolades mal ouvertes/fermées
    Du code html là où il ne faut pas (tu as oublié les balises head )
    Des comparaisons dans tes if avec un seul égal (alors qu'il en faut deux (ou trois selon les besoins...))

    Bref..
    ceci devrait marcher
    <!DOCTYPE html>
    <html>
      <head>
      <title>Test Mouvement</title>
      <link rel="stylesheet" href="TestMouv.css">
      </head>
      <body>
      <button id="startbut" onclick="moveX()" class="startbut">Lancer la partie</button>
      <canvas id="canvas" class="canvas" width="1890" height="935">canvas</canvas>
      <p class="wintxt"></p>
      
    <script type="text/javascript">      
    function moveX(){   
      document.getElementById('startbut').style.display='none'
      document.getElementById('canvas').style.display='block'
      var canvas = document.getElementById('canvas');
      var point = canvas.getContext('2d');
      var x = 945
      var y = 440 
      point.fillStyle = 'black';
      point.arc(945, 440, 15, 0, 2 * Math.PI);
      point.fill();
    
      for (let pas = 0; pas < 1; pas++) { 
    
        var direction = [Math.floor(Math.random() * 4)];
        console.log(direction);
    
        if (direction == 0) {
          setTimeout(function(){
          console.log([right]);
          var x = (x)+10
          point.arc(x, y, 15, 0, 2 * Math.PI);}, 1000);
        }else if (direction = 1) {
          setTimeout(function(){
            console.log([top]);
            var y = (y)-10
            point.arc(x, y, 15, 0, 2 * Math.PI);
            }, 1000);
         }else if (direction == 2) {
            setTimeout(function(){
            console.log([left]);
            var x = (x)-10
            point.arc(x, y, 15, 0, 2 * Math.PI);}, 1000);
         }else{  
            setTimeout(function(){
              console.log([bottom]);
              var y = (y)+10
              point.arc(x, y, 15, 0, 2 * Math.PI);
              }, 1000);      
         }
        }
    } 
    </script>
     </body>  
    </html>
    

    1
  2. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Bonjour
    Il nous faudrait le code html complet de ta page
    0
    1. Codeur_du_Dimanche Messages postés 2 Date d'inscription   Statut Membre Dernière intervention  
       
      <!DOCTYPE html>
      <html>
       <title>Test Mouvement</title>
       <body>
        <button id="startbut" onclick="move()" class="startbut">Lancer la partie</button>
        <canvas id="canvas" class="canvas" width="1890" height="935">canvas</canvas>
        <p class="wintxt"></p>
        <link rel="stylesheet" href="TestMouv.css">
          <script type="text/[/javascript/jsintro.php3 javascript]">   
          
                       function move(){   
            document.getElementById('startbut').style.display='none'
            document.getElementById('canvas').style.display='block'
              var canvas = document.getElementById('canvas');
                          var point = canvas.getContext('2d');
           var x = 945
           var y = 440 
                              point.fillStyle = 'black';
            point.arc(945, 440, 15, 0, 2 * Math.PI);
                              point.fill();
                  
           for (let pas = 0; pas < 1; pas++) { 
           
                              var direction = [Math.floor(Math.random() * 4)];
             console.log(direction);
                    
                              if (direction = 0) {setTimeout(function() console.log([right]);
            var x = (x)+10
             point.arc(x, y, 15, 0, 2 * Math.PI);}, 1000);
            
                              if (direction = 1) {setTimeout(function() console.log([top]);
            var y = (y)-10
             point.arc(x, y, 15, 0, 2 * Math.PI);}, 1000);
             
                              if (direction = 2) {setTimeout(function() console.log([left]);
            var x = (x)-10
             point.arc(x, y, 15, 0, 2 * Math.PI);}, 1000);
            
                              else{       {setTimeout(function() console.log([bottom]);
            var y = (y)+10
             point.arc(x, y, 15, 0, 2 * Math.PI);}, 1000);      
                    }}} 
             </script>
       </body>  
      </html>
      



      EDIT : Ajout du LANGAGE dans les balises de code pour avoir la coloration syntaxique et l'indentation du code.
      0