Question

我正在尝试更好地了解范围并在javascript中链接。我有以下工作正常

$("div.sked, div.report, div.database").hover (function (){
     let $this = $(this);
     let $pos = $this.position();
     $submenu = $this.find (":first-child");
     $submenu.css ('left', $pos.left + 30);
     $submenu.css ('top', $top);
     $submenu.show();
     })
     .mouseleave  (function (){
     $submenu.hide();
 });

但是当我在let之前添加$submenu = $this.find (":first-child");时然后$submenu超出范围，子菜单不会被隐藏。

我想了解正确的编码方式。

谢谢...

Answer 1

那是因为let变量是块作用域的，而不是函数作用域。如果在第一个回调中声明变量，则不能在其他回调中使用它，因为块已被更改。

要在两个函数之间共享变量，您需要在两个函数可用的位置声明它。

但是，在您的情况下，没有可以执行事件处理程序的地方，无论其声明的顺序如何。因此，您需要在mouseleave的回调中再次获取该元素。

$("div.sked, div.report, div.database").hover(function() {
    let $this = $(this);
    let $pos = $this.position();
    $submenu = $this.find(":first-child");
    $submenu.css('left', $pos.left + 30);
    $submenu.css('top', $top);
    $submenu.show();
  })
  .mouseleave(function() {
    let $this = $(this);
    $submenu = $this.find(":first-child");
    $submenu.hide();
  });

理解javascript中的范围和jquery链接

1 个答案: