javascript - JS - 未捕获的语法错误 : Unexpected Token

Question

大家早上好

我决定在本周末开始学习 JavaScript，但现在遇到了第一个障碍。我已经尝试使用谷歌搜索/研究此错误的原因，据我所知，所有内容的格式均正确无误。你能帮忙吗？该代码旨在制作一个箭头形状的按钮，该按钮由容器中的 2 个小 div 组成，在我的网页上悬停时会发光。

$(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");
});
});

我添加了“box-shadow: 0;” .toggle-button .menu-bar-top 和 .toggle-button .menu-bar-bottom css 类，但我怀疑这与我的 JS 代码有关。我在 Chrome v55 中工作。对此的任何帮助将不胜感激!

Answer 1

您在第 4 行的末尾有一个 ,。所以 Uncaught SyntaxError: Unexpected token . 错误是由于 $toggleButton.hover.

对于您的浏览器，您仍然声明一个新变量，但您可以在变量名称中使用 .。

要解决您的问题，只需将第 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");
  });
});