のrelとhrefの試合

Question

http://jsfiddle.net/aprWP/

<a href="#numtag-1">One</a> 
<a href="#numtag-2">Two</a> 
<a href="#numtag-3">Three</a> 

<div class="numtag-1">One</div> 
<div class="numtag-2">Two</div> 
<div class="numtag-3">Three</div> 

..ホバーに適切なdivが 'アクティブ' クラスを切り替える必要があります。

多くのことを試しましたが、うまく動作しません。

おかげ

Answer 1

：私はそれを行うための良い方法だと思うと、サブストリングを使用するように変更

$('a').hover(function() { 
    $('div.' + $(this).attr('href').substring(1)).toggleClass('active'); 
}); 

http://jsfiddle.net/aprWP/7/

。

Answer 2

これはいいと簡単です。 、aに.hover()イベントを使用しaのhref属性からクラスを作成し、ここであなたはそれを持っている：

$(document).ready(function() { 
    $("a").hover(function() { 
     var str = $(this).attr("href").replace("#", ""); 

     $("div." + str).addClass("active"); 
    }, function() { 
     var str = $(this).attr("href").replace("#", ""); 

     $("div." + str).removeClass("active"); 
    }); 
}); 

は、あなたがそれ故に、href属性から#を削除する必要があることに留意しています.replace("#", "")部分。ホバーイベントとtoggleClassの組み合わせを使用して

Answer 3

$(document).ready(function() {  
    $('a').hover(function() { 
     var selector = 'div.' + $(this).attr('href').substr(1); 
     $(selector).addClass('active'); 
    }, function() { 
     var selector = 'div.' + $(this).attr('href').substr(1); 
     $(selector).removeClass('active'); 
    }); 
}); 

http://jsfiddle.net/aprWP/3/

Answer 4

次

$(document).ready(function() { 
    $('a').hover(function() { 
     var id = $(this).attr('href').substring(1); 
     $('.' + id).addClass('active'); 
    }, function() { 
     var id = $(this).attr('href').substring(1); 
     $('.' + id).removeClass('active');   
    }); 
}); 

JSFiddle試してみてください - このコードを試してみてくださいhttp://jsfiddle.net/aprWP/4/

Answer 5

を：

$(document).ready(function() { 
    $('a').hover(function(){  
     var url = $(this).attr('href'); 
     var className = url.substring(1); 
     $('div.' + className).toggleClass('active'); 
    }); 
});