Question

我有一个按钮，点击后会创建一个滑块。

HTML：

<a id="slider"class = "button small">Create Slider</a>

JS：

$('#slider').click(function(eventClick, posX, posY){
     var htmlData='<div id="sldr'+$.count+'" class="draggable"' + 'data-page="' + $.page + '" ';
     htmlData += 'style="height:25px; width:360px"><input id="movingslider'+$.count+'" class="sldr" type="text" data-slider="true" data-slider-range="10,1000"><span class="output"></span><a href="#" class="delete"></a></div>';
     var temp = $.count
     $('.demo').append(htmlData);   
     $('#movingslider'+temp).simpleSlider();
     $('#movingslider'+temp).bind("slider:ready slider:changed", function (event, data) {
     $(this).nextAll(".output:first").html((data.value.toFixed(3)));
     });
        $('#sldr'+temp).draggable({
            containment: "#workspace",
            scroll: false,
            cancel: false,
        }
     })     
     $('a.delete').on('click',function(e){
           e.preventDefault();
           btnID = $(this).closest('.draggable')[0].id;
           //alert('Now deleting "'+objID+'"');
           $('#'+btnID+'').remove();
       });
    $.count++;
});

我对新创建的滑块的值有些问题。我已经指出范围应该是10-1000但是当我开始滚动滑块时，它显示默认范围，0-1。我怎样才能更改打印的范围？

Answer 1

在滑块的配置中，您可以指定范围和步骤：

数据滑块范围：

表示滑块开始和结束的范围。例如。数据滑块范围=＆＃34; 10,1000＆＃34;

数据滑块步骤：

拖动滑块时移动的间隔。例如。数据滑块步=＆＃34; 100＆＃34;

然后您可以访问滑块的值：

$("#movingslider").bind("slider:changed", function (event, data) {
  // The currently selected value of the slider
  alert(data.value);

  // The value as a ratio of the slider (between 0 and 1)
  alert(data.ratio);
});

通过loopj实现Simple Slider

1 个答案: