0

クラス navLink を含む一連のタグがあります。

<li><a href="whatever0.html" class="naviLink"><img src="some-image0.jpg" /></a></li>
<li><a href="whatever1.html" class="naviLink"><img src="some-image1.jpg" /></a></li>
<li><a href="whatever2.html" class="naviLink"><img src="some-image2.jpg" /></a></li>

同じ数の要素 (この場合は 3) を含むページの別の領域があります。それらは同じ順序です。

<div id="main_navi">
<ul>
<li>Some Content 0</li>
<li>Some Content 1</li>
<li>Some Content 2</li>
</ul>
</div>

私が使用している jQuery プラグインは、 #main_navi 内のすべてを自動的にカルーセル型システムのリンクにします。li タグをクリックすると、関連付けられた画像にスクロールします。その行為はいいと思います。

ここに私の問題があります: 私のクライアントは無限の知恵で、liをクリックしてその画像に対応するページに移動するときにデフォルトの動作を変更することを望んでいます(この場合、whatever.htmlリンクの内容.

これまでのところ、私はこれをしました：

$("#main_navi li").click(function() {
  // to find out which li was clicked on
  var index = $(this).index();

  // then i want to grab what url it was referencing..
  alert($('.naviLink').eq(index).attr('href'));
  });

});

ただし、最初のリンク Some Content 0 をクリックすると、最後のリンク (whatever2.html) の URL が警告されます。私は何を間違っていますか？

4

3 に答える 3

0

あなたはこれを試すことができます

$("#main_nav li").click(function () {
    var index = $(this).index();

$('.naviLink').each(function(index2){

if(index == index2)
{
     alert($(this).attr('href'));
}

});

});
于 2012-04-12T17:08:35.937 に答える
0

href の最初の引用符が欠落しているようです。 

<li><a href="whatever0.html" class="naviLink"><img src="some-image0.jpg" /></a></li>
<li><a href="whatever1.html" class="naviLink"><img src="some-image1.jpg" /></a></li>
<li><a href="whatever2.html" class="naviLink"><img src="some-image2.jpg" /></a></li>

編集: これはあなたをカバーする必要があります。

$("#main_navi li").on("click", function() {
    alert($('.naviLink').eq($(this).index()).attr('href'));
});

JSFiddle

于 2012-04-12T16:57:28.683 に答える