Javascript JS-未捕获的语法错误：意外标记

大家早上好

我决定在这个周末开始学习JavaScript，现在我遇到了第一个障碍。我试着用谷歌搜索/研究这个错误的原因，据我所知，所有的东西都是正确格式化的。你能帮忙吗？该代码的设计目的是使我的网页上的箭头状按钮在悬停时发光，该按钮由容器中的两个小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");
});
});

---

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

第4行末尾有一个

，

。因此，

Uncaught SyntaxError:意外标记。

错误是由于

$toggleButton.hover

引起的

对于浏览器，您仍在声明新变量，但可以在变量名称中使用

要解决问题，只需将

，

替换为

在第4行：

$（文档）.ready（函数（）{
变量$toggleButton=$（'.toggleButton'），
$bartop=$（'.toggle button.menu bar top'），
$barbottom=$（'.toggle button.menu bar bottom'）；
$toggleButton.hover（函数（）{
$bartop.css（“盒子阴影”，“0 0 10px 1px#fff”）；
$barbottom.css（“盒子阴影”，“0 0 10px 1px#fff”）；
}，函数（）{
$bartop.css（“框阴影”，“0”）；
$barbottom.css（“框阴影”，“0”）；
});
});
这会给您带来语法错误，因为您在下面的语句末尾使用了逗号

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

由于逗号，javascript将
$toggleButton
视为变量声明，因为它位于下一行。它已经在顶部声明了，所以javascript抛出了语法错误，它已经声明了。
删除逗号并使用分号
在变量声明的末尾有一些逗号，应该是分号“；”以及变量声明开头缺少的一些var关键字

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