0

我在容器 div 中定义了许多滑块,例如

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

还有很多

它们由slider()定义为的 jQuery UI 功能控制

$(".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()有两个参数,第一个是索引,第二个是元素:

$(".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
        }
    });
});​

当 only 时$(".slider").each(function(e) {...}, thene将是索引而不是元素,因此您试图获取数字 0、1、2 等的 ID。

于 2012-08-11T14:35:13.237 回答
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 回答
0

使用or的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 回答