0

我有一些链接，我想基本上做一个班级交换。当我像这样设置它时，它会一直运行：

$("#work").click(function() {
    $(".nav_middle_text").removeClass("selected");
    $(".nav_middle_text").addClass("notselected");
    $(this).removeClass("notselected");
    $(this).addClass("selected");  


    a1=1;

    $("#top_section").animate({
        height:30
    },450);
    $("#bottom_section").animate({
        height:$("#grid").outerHeight(true)
    }, 450); 
    $("#about_container").animate({
        marginTop:$("#about_container").outerHeight(true) *-1
    }, 450);   

});

但是当我尝试以这种方式设置它时，它会运行前两个添加和删除具有特定类的类，但后两个使用“this”不起作用。以这种方式运行它是否有理由阻止“这个”工作？

function nav_click() {
    $(".nav_middle_text").removeClass("selected");
    $(".nav_middle_text").addClass("notselected");
    $(this).removeClass("notselected");
    $(this).addClass("selected");          
}    



$("#work").click(function() {
    nav_click();


    a1=1;

    $("#top_section").animate({
        height:30
    },450);
    $("#bottom_section").animate({
        height:$("#grid").outerHeight(true)
    }, 450); 
    $("#about_container").animate({
        marginTop:$("#about_container").outerHeight(true) *-1
    }, 450);   
});

提前感谢您的帮助

4

3 回答 3

2

当您调用函数nav_click()时，this不再是单击处理程序中的内容。如果要使用该nav_click()函数，则必须将 的值传递this给该函数。您可以通过this在函数内部进行适当设置来做到这一点：

nav_click.call(this);

或者，您可以将其作为普通参数传递并更改 nav_click() 以使用该参数

nav_click(this);

function nav_click(item) {
    $(".nav_middle_text").removeClass("selected");
    $(".nav_middle_text").addClass("notselected");
    $(item).removeClass("notselected");
    $(item).addClass("selected");          
}

仅供参考，this函数内部的值取决于该函数的调用方式。如果仅使用普通函数调用nav_click()，则将this重置为window对象（普通 JS 模式）或undefined（JS 严格模式）。

要在函数内显式this设置为特定值，请使用.apply()or .call()。有关这些方法的说明，请参见 MDN 页面，此处和此处。

于 2012-12-11T14:41:49.783 回答
0

在匿名事件处理函数的上下文中，this引用发生事件的元素。出于这个原因，this没有引用您认为它在第二种情况下的含义。

但是，您可以将元素传递给函数：

function nav_click(element) {
    $(".nav_middle_text").removeClass("selected");
    $(".nav_middle_text").addClass("notselected");
    $(element).removeClass("notselected");
    $(element).addClass("selected");          
} 

$("#work").click(function() {
    nav_click(this);
    // etc
});
于 2012-12-11T14:46:50.190 回答
0

发生这种情况是因为您没有在回调函数中传递任何内容，您只需要传递元素，这不引用#work，因此您无法更改类这样做......

function nav_click(element) {
    $(".nav_middle_text").removeClass("selected");
    $(".nav_middle_text").addClass("notselected");
    $(element).removeClass("notselected");
    $(element).addClass("selected");          
}    
    $("#work").click(function() {
    nav_click(this);


    a1=1;

    $("#top_section").animate({
        height:30
    },450);
    $("#bottom_section").animate({
        height:$("#grid").outerHeight(true)
    }, 450); 
    $("#about_container").animate({
        marginTop:$("#about_container").outerHeight(true) *-1
    }, 450);   
});
于 2012-12-11T15:02:45.530 回答