Question

我使用Codrops的jQuery滑块分页：http://tympanus.net/Development/SliderPagination/

我希望通过更改输入文本的值来更新滑块的值，反之亦然。

但是，当我在输入文本中键入一些值时，该值不会更新，而是显示在新的分页滑块上。

这段代码：

$(function () {
    $("#aduhh").change(function(){
        // alert($("#aduhh").val())
        $( "#slider" ).pagination( {
            Value : $("#aduhh").val(),
        });
    });  
    $( "#slider" ).pagination( {
        Value : 10,
        total : 100,
        step:1,  
        next:1,
        onChange : function( value ) { 
        $("#aduhh").val(value);
        }
    });
});

HTML：

<div id="slider" class="sp-slider-wrapper">
   <nav>
      <a href="#" class="sp-prev">Previous</a>
      <a href="#" class="sp-next">Next</a>
   </nav>
</div> 

  <input type="text" id="aduhh" />

这是http://jsfiddle.net/teman_bermain/c2peX/2

我该怎么做？感谢。

抱歉我的语法。

Answer 1

每次更改$("aduhhh")的值时，您的代码都会添加新的分页滑块，因为您在回调时调用.pagination。

$(function() {
    var initValue = 10;

    $("#aduhh").val(initValue);

    var mySlider = $("#slider").pagination({
        value : initValue,
        total : 100,
        step : 1,
        next : 1,
        onChange : function(value) {
          $("#aduhh").val(value);
        }
    });

    $("#aduhh").change(function() {
      var currentValue = $("#aduhh").val();

      mySlider.slider.value = currentValue;
      $("#slider span").text(currentValue);
    })
})

如何通过输入类型更新jquery滑块分页（codrops）的值

1 个答案: