Question

我正在使用JQuery和JQuery UI Slider在我的HTML页面中呈现一些控件，我想从HTML中的属性设置滑块的范围。

以下是我用来初始化滑块的代码......

$( ".slider" ).slider(
  {
    range: "min",
    value: 0,
    min: 0,
    max: 5,
    slide: handleSlide
  }
);

当然最大值是硬编码的。我想在我的代码中做的是......

<div class="slider" id="sliderA" max="10"></div>

但我无法弄清楚如何在选择期间获取属性。

我以为我可以通过this访问它，就像你在JQuery的.each()中那样，但是firebug告诉我它是文档，所以这不起作用。

我想做点像......

$( ".slider" ).slider(
  {
    range: "min",
    value: 0,
    min: 0,
    max: blah.getAttribute("max"),
    slide: handleSlide
  }
);

但我无法弄清blah可能是什么。

有可接受的方法吗？我承认JQuery对我来说仍然有一点黑魔法，但是我假设选择器以某种方式解析为一个对象数组，所以感觉我应该能够得到这些元素。

Answer 1

    $( ".slider" ).each(function()
    {
     $(this).slider(
      {
        range: "min",
        value: 0,
        min: 0,
        max: $(this).attr("max"),
        slide: handleSlide
      }
    );
    });

Answer 2

不，你不能。

您的代码会创建一个对象文字，然后将其传递给slider方法。在对象文字内，您的外部$调用不存在。

相反，您需要在.slider()内调用.each，允许您为每个元素创建单独的对象文字。
此外，由于您要在each回调中创建对象文字，因此this回调中会有each。

Answer 3

看起来您最好的选择是动态获取“max”属性的值：

    $('.slider').each(function (index) {
        $(this).slider({
            max: $(this).attr('max'),
            slide: function (event, ui) {
                console.info(ui.value);
            }
        });
    });

我可以获得JQuery在选择期间选择的各个元素的属性吗？

3 个答案: