0

コンテナdivで定義されたスライダーの数があります

  <div id="opacitySlider" class='slider'>
    <div class="sliderText">Fade Opacity</div>
    <div id="fadeVal"></div>
  </div>

などなど

slider()これらは、次のように定義されたjQueryUI機能によって制御されます。

$(".slider").each(function(e){
  $(this).slider({
    value: 50,
    orientation: 'horizontal',
    animate: true,
    range: 'min',
    slide: function(e, ui){
      console.log($(e).id);
      console.log($(this).id;
    }
  });
});

私がやりたいのは、スライダーの値divを関連するスライダーの値で更新することです

両方のコンソールログステートメントは未定義を返します。正しいdiv要素を更新するには、イベントを発生させるスライダーのIDを知る必要があります。これどうやってするの？

4

4 に答える 4

2

.each()2つの引数があり、1つ目はインデックス、2つ目は要素です。

$(".slider").each(function(i, e) {
    $(e).slider({
        value: 50,
        orientation: 'horizontal',
        animate: true,
        range: 'min',
        slide: function(e, ui) {
            console.log(this.id); //new scope
        }
    });
});​

のみ$(".slider").each(function(e) {...}を実行eする場合は、要素ではなくインデックスになるため、0、1、2などの数値のIDを取得しようとしています。

于 2012-08-11T14:35:13.237 に答える
0

またはのidプロパティを使用します：thise.target

slide: function(e, ui){
  console.log(this.id);
  //or
  console.log(e.target.id);
}

jsFiddle

于 2012-08-11T14:34:29.290 に答える
0

$(this).attr('id');またはする必要があります $(e).attr('id');

于 2012-08-11T14:18:51.823 に答える
0

これを試して：

$(".slider").each(function(e){

  var curSlider = $(this);

  $(this).slider({
    value: 50,
    orientation: 'horizontal',
    animate: true,
    range: 'min',
    slide: function(e, ui){

      console.log(curSlider.attr('id'));

    }
  });
});
于 2012-08-11T14:23:47.793 に答える