在Javascript中创建时间微调器

您能否帮助我创建一个时间微调器，如下图所示：

-0:00+

• 和+是按钮，值在文本框0:00中。数值应以15分钟为单位递增，即0:15；0:30

如何实现这种功能

谢谢

HTML

---

本网站旨在帮助那些代码无法满足他们的需求，但他们自己却试图解决这些问题的人。请不要要求他人为您编写代码。您尝试了什么？？？谢谢您的帮助，但小提琴显示时间，我需要将该值增加/减少15分钟。有什么帮助吗

<div id="inputs">
    <form>
        <div id="when">
            <input id="timespinner" name="timespinner" value="00:00 AM" />
        </div>
    </form>
</div>
<div id="time"></div>

//Trying to get the time div to update when the time is changed
//code is only minimally changed from the JQuery UI demo page here:
//http://jqueryui.com/spinner/#time

$(document).ready(function () {
    var time = 'time';    //I need this to be more widely available so it's declared out here
    $('#time').html(time);//check that the JQuery call actually does what it's supposed to

    $.widget("ui.timespinner", $.ui.spinner, {
        options: {
        // seconds
        step: 15 * 60 * 1000,
        // hours
        page: 60,
        spin: function () { 
                  time = $(this).val();
                  console.log(time);
                  $('#time').html(time);
               }
    },

        _parse: function (value) {
            if (typeof value === "string") {
                // already a timestamp
                if (Number(value) == value) {
                    return Number(value);
                }
                return +Globalize.parseDate(value);
            }
            return value;
        },

        _format: function (value) {
            return Globalize.format(new Date(value), "t");
        }
    });

    $("#timespinner").timespinner();
    $("#timespinner").change(function () { //TODO not working :(
        time = $(this).val();
        console.log(time);
        $('#time').html(time);
    });
});