Question

我正在尝试将一个类添加到父<li>，这是我一直尝试的没有结果：

function calendaractive(){
    $(this).parent('li').addClass("active");
}

HTML

<li>
    <a href="javascript:void(0)" onclick="calendaractive();">2009</a>
</li>

为什么这不起作用？

Answer 1

尝试。
在函数绑定中传递this

<li>
    <a href="javascript:void(0)" onclick="calendaractive(this);">2009</a>
</li>

相应地更改JS

function calendaractive(anchorLink){
    $(anchorLink).parent().addClass("active");
}

Answer 2

最好不要混用HTML和JavaScript。最好检查JavaScript本身内的点击： -

$(document).ready(function(){    
    $('li > a').on('click', function(e) {           
        $(this).parent().addClass('active');            
    });    
});

将JavaScript与HTML分开将使其更易于维护（与CSS相同的论点）。

Answer 3

您应该使用JQuery而不是onClick方法添加事件：

JS应该是这样的：

$(document).ready(function(){ 
    $("a").click(function() {
        $(this).parent('li').addClass("active");
    });
});

HTML就像这样

<li>
    <a href="#">2009</a>
</li>

注意这将添加到所有锚链接，如果您只想将click事件添加到某些锚链接，请使用类

Answer 4

javascript中的this关键字表示不同位置的不同内容。有时它是窗口，有时它是使用它的功能，有时是不同的东西。这取决于调用函数的方法。这里有更多信息（更准确）：How does the "this" keyword work?

所以当你写$(this)时，jQuery认为你的意思是这个类应该被添加到这个对象中。无论它是什么。

如果你把一个id选择器作为参数放到jQuery中，或者更好地传递一个参数，你的代码应该可以工作。

AddClass到函数</li>上的父<li>

4 个答案: