jQueryMobile - Spinbox Demo

The spinbox control is simple to use - just load the script after jQM, and set your data-type="spinbox". Initial input type can be whatever you want, nothing is changed - min/max are enforced with the buttons.

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
<script type="text/javascript" src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>

<!-- Optional Mousewheel support: http://brandonaaron.net/code/mousewheel/docs -->
<script type="text/javascript" src="PATH/TO/YOUR/COPY/OF/jquery.mousewheel.min.js"></script>

<script type="text/javascript" src="http://dev.jtsage.com/cdn/spinbox/latest/jqm-spinbox.min.js"></script>
<div data-role="fieldcontain">
    <label for="spin">Input spinner</label>
    <input type="text" data-role="spinbox" name="spin" id="spin" value="60" min="0" max="100" />
</div>

Take a look at the stock datebox docs for how to use data-options - there is one available, "repButton" : BOOL - controls whether press-and-hold functionality is enabled (default: true)

Standard Size

data-mini="true" Size

With a Stepper

GitHub Source Support Forums Contact jQueryMobile Homepage