0
$('.selected').removeClass('selected');
$(this).addClass('selected');

上記の2行のコードを追加する前は、関数全体が機能していました。これで、クリックするとこれらの2行だけが機能し、残りのコードは機能しなくなります。これらの2行を削除すると、コードは再び機能します。クラスを削除してクラスを追加すると、この関数の残りの部分が台無しになる可能性がありますか?私はここで何が間違っているのですか?

$(document).ready(function(){
    var subject;
    $('.subject').mouseenter(function(){
        if ( $(this).hasClass(subject) ) {
            return 0;
        }
        else {
            $(this).find('.info, img').fadeTo('fast', 1);
        }
    });
    $('.subject').mouseleave(function(){
        if ( $(this).hasClass(subject) ) {
            return 0;
        }
        else {
            $(this).find('.info').fadeTo('fast', 0);
            $(this).find('img').fadeTo('fast', 0.8);
        }
    });

    // BELOW IS WHERE THE PROBLEM IS

    $('[class$=-link]').click(function(){
        $('.selected').removeClass('selected'); // Why do these lines break the 
        $(this).addClass('selected');           // rest of this function?
        $('.' + subject).find('.info').fadeTo('fast', 0);
        $('.' + subject).find('img').fadeTo('fast', 0.8);
        subject = $(this).attr('class').replace("-link","");
        $('.'+ subject ).find('.info, img').fadeTo('fast', 1);
    });
});

http://jsfiddle.net/n4SUX/2/

4

1 に答える 1

2

私が知る限り、あなたはこのようなものが欲しいです(HTMLを変更する必要性を回避します):

$('[class$=-link]').click(function(){
    $('.selected').removeClass('selected');
    $('.' + subject).find('.info').fadeTo('fast', 0).end().find('img').fadeTo('fast', 0.8);
    subject = $(this).attr('class').replace("-link","");//execute this line while "selected" class is not present
    $('.'+ subject).find('.info, img').fadeTo('fast', 1);
    $(this).addClass('selected');//add after everything else is complete
});
于 2013-03-26T13:15:03.570 に答える