jQuery UI。加上一个设置选项

时间:2014-06-14 11:13:42

标签: javascript jquery jquery-ui

我在初始化后为spinner设置选项时遇到了一些问题。

在HTML中,它看起来像:

<input class="spinner" value="1000" data-step="20" />

和JS:

$(document).ready(function() {
    $('.spinner').spinner({
        min: 1,
    });

    $('.spinner').each(function() {
        var $this = $(this);

        if($this.is('[data-step]')) {
            var step = $this.attr('data-step');

            $this.spinner('option', 'step', step);

        }
    });
});

设置选项后,我的值为1001 ..为什么?我尝试使用.spinner('value', 1000)在此之后设置值,但它不起作用。请帮助:)

JSFiddle

上的示例

3 个答案:

答案 0 :(得分:2)

运行代码时,

最小值为automatically添加到input value。因此,将min值设置为0

$('.spinner').spinner({
        min: 0,
    });

JQuery Doc

答案 1 :(得分:0)

看起来你没有声明属性data-step所以它是自动设置的。这就是我做的工作:

$(document).ready(function() {
    $('.spinner').spinner({
        min: 1,
    });
    $('.spinner').attr('data-step',1);

    $('.spinner').each(function() {
        var $this = $(this);

        if($this.is('[data-step]')) {
            var step = $this.attr('data-step');

            $this.spinner('option', 'step', step);

        }
    });
});

这是一个jsfiddle showing modification shows it working。希望这是你正在寻找的。

答案 2 :(得分:0)

为什么会这样。 Spinner为您量化值。否则可以通过降低获得0。但是既然你说最小值是1 =&gt;它会将其添加到值中,以便您不会以0或20结尾。

检查source code,您会看到到底发生了什么:

_adjustValue: function (value) {
    var base, aboveMin,
    options = this.options;

    // make sure we're at a valid step
    // - find out where we are relative to the base (min or 0)
    base = options.min !== null ? options.min : 0;
    aboveMin = value - base;
    // - round to the nearest step
    aboveMin = Math.round(aboveMin / options.step) * options.step;
    // - rounding is based on 0, so adjust back to our base
    value = base + aboveMin;

    ...
},

在您的情况下,base变为1aboveMin将为1000,结果value将变为1001