0

我this noUiSlider在我的应用程序中使用。但我不能使用它的set方法并以编程方式设置它的值。我正在尝试如下：

$(this).noUiSlider.set([null, 2000000]);

但它会引发控制台错误，说$(this).noUiSlider.set([null, 2000000]); 不确定什么是正确的方法。根据他们的文档，它应该可以工作..这是演示

HTML

<div class="form-group">
  <label>Price Range?</label>
  <div class="ui-slider" id="price-slider" data-value-min="10000" data-value-max="4000000" data-value-type="price" data-currency="&#8377;" data-home="home" data-currency-placement="before">
    <div class="values clearfix">
      <input class="value-min" name="value-min[]" readonly>
      <input class="value-max" name="value-max[]" readonly>
    </div>
    <div class="element"></div>
  </div>
</div>

和JS

if ($('.ui-slider').length > 0) {
  $('.ui-slider').each(function() {
    var step;
    if ($(this).attr('data-step')) {
      step = parseInt($(this).attr('data-step'));
    } else {
      step = 10;
    }
    var sliderElement = $(this).attr('id');
    var element = $('#' + sliderElement);
    var valueMin = parseInt($(this).attr('data-value-min'));
    var valueMax = parseInt($(this).attr('data-value-max'));
    $(this).noUiSlider({
      start: [valueMin, valueMax],
      connect: true,
      range: {
        'min': valueMin,
        'max': valueMax
      },
      step: step
    });
    if ($(this).attr('data-value-type') == 'price') {
      if ($(this).attr('data-currency-placement') == 'before') {
        $(this).Link('lower').to($(this).children('.values').children('.value-min'), null, wNumb({
          prefix: $(this).attr('data-currency'),
          decimals: 2,
          thousand: ','
        }));
        $(this).Link('upper').to($(this).children('.values').children('.value-max'), null, wNumb({
          prefix: $(this).attr('data-currency'),
          decimals: 2,
          thousand: ','
        }));
      } else if ($(this).attr('data-currency-placement') == 'after') {
        $(this).Link('lower').to($(this).children('.values').children('.value-min'), null, wNumb({
          postfix: $(this).attr('data-currency'),
          decimals: 0,
          thousand: ' '
        }));
        $(this).Link('upper').to($(this).children('.values').children('.value-max'), null, wNumb({
          postfix: $(this).attr('data-currency'),
          decimals: 0,
          thousand: ' '
        }));
      }
    } else {
      $(this).Link('lower').to($(this).children('.values').children('.value-min'), null, wNumb({
        decimals: 0
      }));
      $(this).Link('upper').to($(this).children('.values').children('.value-max'), null, wNumb({
        decimals: 0
      }));
    }
    if ($(this).attr('id') == "price-slider")
      $(this).noUiSlider.set([null, 2000000]); //error here, doesn't identify the function.
  });
}

任何帮助表示赞赏！

4

1 回答 1

1

越野车滑块。

您有机会将 noUISlider 更新到最新version 8.2.1 - 2015-12-02 21:43:14吗？你有一个一年多以前的。

此外，当您在循环中使用它时，它似乎也无法正常工作$(this).

我删除了所有Link&的To东西，因为我不知道它是否与滑块有关并且它导致了错误。

看看这是否有效：

    if ($('.ui-slider').length > 0) {
      $('.ui-slider').each(function() {
        var step;
        if ($(this).attr('data-step')) {
          step = parseInt($(this).attr('data-step'));
        } else {
          step = 10;
        }
        var sliderElement = $(this).attr('id');
        var element = $('#' + sliderElement);
        var valueMin = parseInt($(this).attr('data-value-min'));
        var valueMax = parseInt($(this).attr('data-value-max'));

//Get Slider old-fashioned way, since you already have its ID
        var sss = document.getElementById(sliderElement)

        noUiSlider.create(sss,{
          start: [valueMin, valueMax],
          connect: true,
          range: {
            'min': valueMin,
            'max': valueMax
          },
          step: step
        });

        if (sliderElement == "price-slider")
          sss.noUiSlider.set([null, 2000000]); //error here
      });
    }
于 2015-12-17T20:09:12.040 回答