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);   

});

しかし、このように設定しようとすると、特定のクラスで最初の2つの追加クラスと削除クラスが実行されますが、「this」を使用する次の2つは機能しません。このように実行すると、「これ」が機能しなくなる理由はありますか？

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()は、オブジェクト（通常のJSモード）または（JS厳密モード）thisのいずれかにリセットされます。windowundefined

this関数内の特定の値に明示的に設定するには、.apply()またはを使用します.call()。これらのメソッドの説明については、MDNページを参照してください。

于 2012-12-11T14:41:49.783 に答える
0

匿名イベントハンドラー関数のコンテキストでthis、イベントが発生している要素を参照します。そのため、this2番目のコンテキストでそれが何を意味すると思うかを参照しないでください。

ただし、要素を関数に渡すことはできます。

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 に答える