0

カスタムメイドのカルーセルロジックに問題があります。

ページで 2 つのイベントを処理する必要があります。ユーザーが左を押すと、セレクターをアクティブなオブジェクトの前のオブジェクトにする必要があります。ユーザーが右を押すと、アクティブなアイテムが「アクティブな」アイテムの隣にあるはずです。

これはhtmlです

<li><a href='/vaara'><img src="/media/954/150.jpg" alt="blabla"/></a></li> 
<li><a href='/vaara'><img src="/media/954/150.jpg" alt="blabla"/></a></li>
<li><a href='/vaara'><img src="/media/954/150.jpg" alt="blabla"/></a></li>

中央の要素は「アクティブな」要素を表します。

これは私が思いついたjqueryです

var activeitem = $("#carousel_ul li:eq(3) a img", this).attr('alt');

そして今、私は prev() または next() 代替テキストを取得したいと思います。このようなもの

carouselItemLeft.on('click', function () {
                    var connectedInsurace = activeitem.next();
4

4 に答える 4

1

eqはゼロベースなので、マークアップに存在しない:eq(3)3 番目の要素を選択してを返します。は String オブジェクトではなく jQuery オブジェクトのメソッドであり、コードでは.liattrundefinednextReferenceError

于 2013-02-19T14:46:47.683 に答える
1

.next()すぐ隣の兄弟を見ます。現在のコンテキストは画像です。必要な「次の」画像は、リスト項目とアンカーでラップされているため、次のようなものが必要です。

var next = activeItem.closest("li").next().find("img").attr("alt");
于 2013-02-19T14:48:09.800 に答える
0

実際の変数を反映するように変数に名前を付ける必要があります。activeitemアイテムの属性に保存するのではなくalt、実際のアイテムを保存する必要があります。

現在アクティブなli要素に。というクラスがあると仮定しactiveます。その場合、コードは次のようになります。

carouselItemLeft.on('click', function () {
    var $activeitem = $("#carousel_ul li.active"); // the li, not the img
    var $connectedInsurace = $activeitem.next();
    var alttext = activeitem.find('img').attr('alt');
于 2013-02-19T14:44:10.693 に答える
0

アイテムにインデックスを使用する代わりに、アクティブなアイテムに実際に data-* タグを割り当てることをお勧めします。

そう:

carouselItemLeft.on('click', function () {
      var $connectedInsurace = $('[data-active="true"]');
      $connectedInsurace.data("active", false);
      $(this).data("active", true);

     // Get next item
     var $next = $connectedInsurace.next();
});
于 2013-02-19T14:51:22.337 に答える