1

使用 jQuery 1.9.1 和 jQuery-ui 1.10.3。想要使用微调器进行时间(小时)控制。除了拥有一组有限的值之外,我还想让它在超过 23 后翻转到 0。我让那部分工作。我遇到的问题是它何时开始。

我用于微调器的代码:

$(function() {
    $("#mystarttime").spinner({
        numberFormat: "d2",
        spin: function(event, ui) {
            if (ui.value > 23) {
                $(this).spinner("value", 0);
                return false;
                    }
            else if (ui.value < 0) {
                $(this).spinner("value", 23);
                return false;
                    }
            console.log("start spin - " + ui.value );
            }
        });
});

输入:

<label for="mystarttime">Start Time (hr):</label>
<input type="text" id="mystarttime" name="startTimeVal">

页面加载时,微调器中没有任何内容。如果我单击微调器上的向上箭头(以递增),spin事件将触发并且我在控制台中收到一条显示值 (1) 的消息。但是,如果我单击微调器上的向下箭头,spin事件不会触发,但我会在输入框中得到 23。直到我再次单击向下箭头,spin事件才会触发,并且输入(和控制台)都显示 22。

如果我单击一次向下箭头,输入框会显示 23(但没有触发事件)。之后,如果我单击一次向上箭头,输入显示 00 (但没有事件触发)。

我一定是做错了什么或查看了错误的事件来检测翻转和更改,但还没有找到一个既翻转又看到事件的好例子。将不胜感激有关如何解决此问题的任何想法或建议。

4

1 回答 1

1

spin:当您自己设置值时不会调用。但change:被称为 - 这应该可以解决问题:

function log(value) {
 console.log(value);
}

$(function() {
    $("#mystarttime").spinner({
        numberFormat: "d2",
        spin: function(event, ui) {
            if (ui.value > 23) {
                $(this).spinner("value", 0);
                return false;
                    }
            else if (ui.value < 0) {
                $(this).spinner("value", 23);
                return false;
                    }
            log(ui.value);
        },
        change: function(event, ui) {
            log($(this).spinner("value"));
        }
        });

});
于 2013-10-25T14:04:38.867 回答