jQuery > UI > Spinner

jQuery UIのスピナーサンプル

HTML

<style>
    @import url(http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css);
</style>
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
<p>
    <label for="spinner">Select a value:</label>
    <input readonly id="spinner" name="value" value="10">
</p>
 
<p>
    <button id="getvalue">Get value</button>
</p>

JavaScript

jQuery(function() {
    var spinner = $("#spinner").spinner({
    	min: 2,
      max: 8,
      step: 0.4
    });
    $("#getvalue").click(function() {
        alert(spinner.spinner("value"));
    });
    $("#setvalue").click(function() {
        spinner.spinner("value", 5);
    });

    $("button").button();
}());