2016-06-28 3 views
0

私はイベントに耳を傾けたいが、それは私のために働いていない 私はconsole.log(ページ)を使ってみることができます。ページ数に耳を傾けるが、私は、コンソールを開いたとき、私は何の応答イベントリスナーがフクロウカルーセルで動作していない

var owl = $('.owl-carousel'); 
 

 

 
     owl.owlCarousel({ 
 

 
      onDragged: callback, 
 

 
      animateOut: 'fadeOut', 
 
      animateIn: 'fadeIn', 
 
      items: 1, 
 
      loop: true, 
 
      autoplay: false, 
 
      nav: true, 
 
      dots: true 
 
     }); 
 
     function callback(event) { 
 

 
      var pages  = event.page.count;  // Number of pages 
 

 
      console.log(pages); 
 

 
     }

あなたが助けてもらえ

を得ることはありませんか?

+0

スクリプトにjquerryを追加しましたか?私にはうまく見えます... owl.owlCarouselの前に印刷して、プロパティをドラッグする前に設定するようにしてください。 – Destrif

答えて

2

コールバック

の代わりに、あなたもちょうどフクロウカルーセルのオプションにコールバックを追加することができ、イベントハンドラを取り付けます。

$('.owl-carousel').owlCarousel({ 
    onDragged: callback 
}); 
function callback(event) { 
    ... 
} 

データ

各イベントは、イベント・オブジェクト内の非常に有用な情報を渡します。上記の例に基づいて:

function callback(event) { 
    // Provided by the core 
    var element = event.target;   // DOM element, in this example .owl-carousel 
    var name  = event.type;   // Name of the event, in this example dragged 
    var namespace = event.namespace;  // Namespace of the event, in this example owl.carousel 
    var items  = event.item.count;  // Number of items 
    var item  = event.item.index;  // Position of the current item 
    // Provided by the navigation plugin 
    var pages  = event.page.count;  // Number of pages 
    var page  = event.page.index;  // Position of the current page 
    var size  = event.page.size;  // Number of items per page 
} 

から:

http://www.owlcarousel.owlgraphic.com/docs/api-events.html

あなたの例では、ちょうどあなたの財産は、owlCarrousselによって取られることを確認した後と前に印刷し、私には正常に見えます。正しいjQueryヘッダーを追加しましたか?

<a href="http://jquery.com/">jQuery</a> 
<script src="jquery.js"></script> 
<script> 
    var owl = $('.owl-carousel'); 

    alert('before') 
    owl.owlCarousel({ 

     onDragged: callback, 

     animateOut: 'fadeOut', 
     animateIn: 'fadeIn', 
     items: 1, 
     loop: true, 
     autoplay: false, 
     nav: true, 
     dots: true 
    }); 
    alert('After') 
    function callback(event) { 

     var pages  = event.page.count;  // Number of pages 

     console.log(pages); 

    } 
</script> 
関連する問題