web-dev-qa-db-fra.com

JS - SyntaxError non capturé: jeton inattendu

Bonjour les gars,

J'ai décidé de commencer à apprendre JavaScript ce week-end et je suis maintenant bloqué au premier obstacle. J'ai essayé de chercher sur Google la raison de cette erreur et, autant que je sache, tout est correctement formaté. Êtes-vous capable d'aider? Le code est conçu pour faire apparaître sur ma page Web un bouton en forme de flèche, composé de 2 petites divs dans un conteneur, qui brillent lorsque vous la survolez.

$(document).ready(function() {
var $toggleButton = $('.toggle-button'),
    $bartop = $('.toggle-button.menu-bar-top'),
    $barbottom = $('.toggle-button.menu-bar-bottom'),


$toggleButton.hover(function() {
    $bartop.css("box-shadow", "0 0 10px 1px #fff");
    $barbottom.css("box-shadow", "0 0 10px 1px #fff");
}, function() {
    $bartop.css("box-shadow", "0");
    $barbottom.css("box-shadow", "0");
});
});

J'ai ajouté "box-shadow: 0;" aux classes CSS de .toggle-button .menu-bar-top et .toggle-button .menu-bar-bottom, mais je suppose que cela a un rapport avec mon code JS. Je travaille dans Chrome v55. Toute l'aide pouvant etre apportée serait très appréciée!

javascriptjquerysyntax-error
3
Richard Goodman

Vous avez un , à la fin de la ligne 4. L'erreur Uncaught SyntaxError: Unexpected token . est donc due à $toggleButton.hover.

Pour votre navigateur, vous déclarez toujours une nouvelle variable, mais vous pouvez utiliser . dans les noms de variables.

Pour résoudre votre problème, remplacez simplement le , par un ; à la ligne 4:

$(document).ready(function() {
  var $toggleButton = $('.toggle-button'),
      $bartop = $('.toggle-button.menu-bar-top'),
      $barbottom = $('.toggle-button.menu-bar-bottom');


  $toggleButton.hover(function() {
    $bartop.css("box-shadow", "0 0 10px 1px #fff");
    $barbottom.css("box-shadow", "0 0 10px 1px #fff");
  }, function() {
    $bartop.css("box-shadow", "0");
    $barbottom.css("box-shadow", "0");
  });
});
4
Jspdown

Cela vous donne une erreur de syntaxe car vous avez utilisé une virgule à la fin de l'instruction suivante

$barbottom = $('.toggle-button.menu-bar-bottom'),

En raison de la virgule, javascript considère $toggleButton comme déclaration de variable car il se trouve sur la ligne suivante. Et comme il est déjà déclaré en haut, javascript renvoie une erreur de syntaxe, qu'il est déjà déclaré. Supprimez la virgule et utilisez le point-virgule ;.

1
prasad

Vous avez des virgules à la fin de vos déclarations de variable qui doivent être des points-virgules ';' et quelques mots-clés var manquants depuis le début de vos déclarations de variables.

$(document).ready(function() {
     var $toggleButton = $('.toggle-button');

 var $ bartop = $ ('. toggle-button.menu-bar-top'); var $ barbottom = $ ('. toggle-button.menu-bar-bottom');

     $toggleButton.hover(function() {
          $bartop.css("box-shadow", "0 0 10px 1px #fff");
          $barbottom.css("box-shadow", "0 0 10px 1px #fff");
      }, function() {
          $bartop.css("box-shadow", "0");
          $barbottom.css("box-shadow", "0");
      });
});
0
SpenceUK