获取点击元素onclick

Question

var submenus = document.getElementsByClassName("submenu");
for (var i = 0; i < submenus.length; i++) {
    submenus[i].onclick = function() {
        toggle(submenus[i].nextSibling);
        return false;
    }
}

function toggle(el) {
    if (el.style.display == 'block') {
        el.style.display = 'none';
    } else {
        el.style.display = 'block';
    }
}

导致错误: TypeError: submenus[i] is undefined

我假设submenus[i]不在函数范围内.如何点击元素以便我可以切换它的下一个兄弟？

Answer 1

var submenus = document.getElementsByClassName("submenu");
for (var i = 0; i < submenus.length; i++) {
    submenus[i].onclick = function() {
        toggle( this.nextSibling);
        return false;
    }
}

在这样的事件处理程序中,this关键字绑定到触发事件的元素.因此,在您的示例中,您可以使用它this来引用子菜单项,从而引用它的兄弟.

有关更多信息,请参阅提供的链接@FelixKling:http://quirksmode.org/js/this.html