Question

我有jQuery simple-slider设置。到目前为止滑块工作正常。以下是用于创建滑块的代码：

<li id="amountSlider">
    <input id="lending" class="slider amount" type="text" data-slider="true" data-slider-highlight="true" data-slider-range="1000,10000" data-slider-step="250" />
    <p>
        <strong>
            £
            <span class="output amount">1000.00</span>
        </strong>
    </p>
</li>

和

<script src="/javascript/simple-slider.min.js" type="text/javascript" charset="utf-8"></script>

我现在正尝试为滑块设置默认值，但它无效。我有：

$("#lending").bind("slider:ready", function (event, data) {
    var selector = $('#lending');
    selector.simpleSlider("setValue", 2500);
});

我知道这是在开火，就像我使用它显示的警告框一样。我得到的错误是：

未捕获的TypeError：无法读取未定义的属性'setValue'

我不知道为什么这不起作用。据我所知，我已正确实施了所有指示。我还检查了simple-slider-min.js文件，方法如下：

simpleSlider: function(){
    var t, r, i;
    return i = arguments[0],
        t = 2 <= arguments.length ? __slice.call(arguments, 1) : [],
        r = [ "setRatio", "setValue" ],
        e(this).each

所以我的想法是选择器未定义，所以我尝试过：

$("#lending").bind("slider:ready", function (event, data) {
    var selector = document.getElementById('lending');
    selector.simpleSlider("setValue", 2500);
});

出现以下错误：

未捕获的TypeError：selector.simpleSlider不是函数

但它是一个函数，我在JS代码中找到了它！我是出于想法，有任何建议/经验吗？

Answer 1

只需在$(document).ready();函数中使用它就可以了！

$(document).ready(function () {
    var selector = $('#lending');
    selector.simpleSlider("setValue", 2500);
});

@import url("http://loopj.com/jquery-simple-slider/css/simple-slider.css");
@import url("http://loopj.com/jquery-simple-slider/css/simple-slider-volume.css");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://loopj.com/jquery-simple-slider/js/simple-slider.js"></script>
<li id="amountSlider">
  <input id="lending" class="slider amount" type="text" data-slider="true" data-slider-highlight="true" data-slider-range="1000,10000" data-slider-step="250" />
  <p><strong>£<span class="output amount">1000.00</span></strong></p>
</li>

JQuery简单滑块

1 个答案: