0

ユーザーがリスト内の次/前のリンクに移動できるようにするナビゲーション矢印を追加しようとしています。

矢印がクリックされたときに、jQueryが次のリンクでクリックイベントを発生させるのに問題があります。

addClass()を使用してテストを設定しましたが、jQueryがクラスを追加しているため、正しいリンクを参照していることがわかります。クリックイベントはトリガーされていません。

HTML:

<ul class="menu">         
     <li class="active">
            <a href="#thelink#">Link text</a>
      </li>
      <li>
            <a href="#thelink2#">Link text 2</a>
      </li>
      <li><a class="next-page" href='#'>></a><li>
</ul>

jQuery:

$jQ(".menu a.next-page").click(function() {         

  $jQ('.menu li.active').next().find('a').addClass('test');

  $jQ('.menu li.active').next().find('a').click();  

});

このコードを使用して、次の矢印をクリックすると、クラス'test'が2番目のリスト項目のリンクに追加されますが、リンクはクリックされません。

4

4 に答える 4

2

これはかなり複雑な例です(クリックで実行する必要があるすべてがわからないため)が、コメントに残すのは正しくないようです。

http://jsfiddle.net/MNczS/1/

var doStuff = function(obj) {
    alert("I did the stuff related to " + obj.attr('href') + "! Woot!");
};

$('a').not('.next-page').on('click', function(e) {
    e.preventDefault();
    doStuff($(this));
});

$(".menu a.next-page").on('click', function(e) {
    e.preventDefault(); 
    $nextAnchor = $('.menu li.active').next().find('a');
    doStuff($nextAnchor);
});​

ばかげたdoStuff()機能は、クリックで発生する何かを表しているだけです。特定の動作をすべてのアンカータグ(次のページのアンカーを除く!)にバインドし、他の動作を次のページのアンカーにバインドすることに注意してください。doStuff最終的には、どちらも同じことを行います。問題のオブジェクトに対して発砲します。しかし、理論的には、の共有機能の前および/または後に、それらに異なることをさせることができますdoStuff()

于 2012-04-11T09:06:51.770 に答える
0

トリガーを使用して、必要なイベントをトリガーします http://api.jquery.com/trigger/

$('li a.next-page').click(function() {
    $('li.active a').trigger('click');
});

したがって、基本的にコードを使用すると、

$jQ(".menu a.next-page").click(function() {         

  $jQ('.menu li.active').next().find('a').addClass('test');

  $jQ('.menu li.active').next().find('a').trigger('click');  

});
于 2012-04-11T09:36:03.390 に答える
0

これを使用してみてください:

$jQ('.menu li.active').next().find('a')[0].click();
于 2012-04-11T08:38:29.677 に答える
0

クリックしても試行がトリガーされない場合があります。

$jQ(".menu a.next-page").live("click",function() {           
  $jQ('.menu li.active').next().find('a').addClass('test');
  $jQ('.menu li.active').next().find('a').click();  
});

また

$jQ(".menu a.next-page").on("click",function() {           
  $jQ('.menu li.active').next().find('a').addClass('test');
  $jQ('.menu li.active').next().find('a').click();  
});
于 2012-04-11T10:06:23.790 に答える