web-dev-qa-db-ja.com

'Flexslider'の現在の画像番号を関数で使用できる変数にするにはどうすればよいですか?

flexslider を使用しています。 this ページの高度なタップの下に例があります(セクション「新しい堅牢なコールバックAPI」使用する slider.currentSlide現在のスライドの番号を取得します。

まったく異なる関数でこの値にアクセスするにはどうすればよいですか?グローバル変数を考えていますが、それが機能するかどうか、関数内の変数をグローバルとして宣言できるかどうかはわかりません。

11
byronyasgur

グローバル変数を宣言し、アフターコールバック関数で値を設定できます。アイデアを得るのに役立ついくつかの擬似コードを次に示します。

var curSlide;
$(window).load(function() {
  $('.flexslider').flexslider({
    after: function(slider) {
      window.curSlide = slider.currentSlide;
    }
  });
});

function useCurSlideHere() {
  alert(window.curSlide);
}

理想的には、グローバル変数の使用を避け、useCurSlideHere関数を、window.loadのインスタンスを作成するクラスにして、afterコールバック関数でcurSlide変数を渡すときに使用することができます。

$(window).load(function() {
  var customSlider = new useCurSlideHere();
  $('.flexslider').flexslider({
    after: function(slider) {
      customSlider.setCurSlide(slider.currentSlide);
    }
  });      
});

function useCurSlideHere() {
  this.curSlide = 0;

  this.setCurSlide = function(curSlide) {
    this.curSlide = curSlide;
  }

  this.getCurSlide= function() {
    alert(this.curSlide);
  }
}

編集:slider.currentSlideを使用するように回答を編集しました。

17
riku

次のコマンドでflexsliderオブジェクトにアクセスすることで、グローバル変数を回避できます。

$(element).data('flexslider')

したがって、あなたの場合は次のものを使用します。

$(element).data('flexslider').currentSlide
36
Lewis