jQuery $（this）选择器在函数内不起作用

Question

我试图制作一个可以通过＆＃39; onclick＆＃39;程序添加的div.hb-menu-subMenuToggle元素的事件。当使用初始选择器作为＆＃39; $（this）＆＃39;

之外的任何内容时，该功能都有效

// FUNCTION: hbMenuSubToggle()
// Toggles CSS classes for animation of .hb-menu-sub-open. Fires when clicking the div element with .hb-menu-subMenuToggle class 
function hbMenuSubToggle(){

    // TESTING: This works as far as opening the submenus; however, it does not open only the submenu that is a direct sibling of the hb-menu-subMenuToggle element.
    $('a.withSubmenu').siblings('ul').toggleClass('hb-menu-sub-open');

    // DESIRED EFFECT: Does not work
    $(this).siblings('ul').toggleClass('hb-menu-sub-open');
};

这是指向该链接的链接 Codepen Project

非常感谢任何帮助！

Answer 1

function hbMenuSubToggle(divyouneed){

// TESTING: This works as far as opening the submenus; however, it does not open only the submenu that is a direct sibling of the hb-menu-subMenuToggle element.
$('a.withSubmenu').siblings('ul').toggleClass('hb-menu-sub-open');

// DESIRED EFFECT: Does not work
divyouneed.siblings('ul').toggleClass('hb-menu-sub-open');
};

并使用它

hbMenuSubToggle($(this))

Answer 2

执行此操作的正确方法是使用jQuery事件处理程序，而不是使用onClick和HTML中的内联函数。

例如，如果您将其放在$(document).ready()中，它会将点击事件处理程序附加到顶部菜单中的所有A元素。单击它后，您将能够获得$(this)（A元素），然后遍历其父（UL元素），然后找到子{{1} }要素（子菜单）切换类。

UL

同样，显示主菜单的功能也可以写成如下

$('#main-nav>ul>li').on('click', '>a', function(){
    $(this).parent().find('ul').toggleClass('hb-menu-sub-open');
});

在此处查看有关CodePen的工作：http://codepen.io/anon/pen/rOKQOJ

Answer 3

对于$（this）你必须先选择一个元素。在一个函数中，你没有这样的..所以只有你直接选择它而不是$（this）

它才会有用

function hbMenuSubToggle() {
  $('.blablabla').blablabla();
}

阅读this以了解有关jQuerys基础知识的更多信息