jQuery-UI スピナー

jQuery-UI スピナー

基本

<input id="price1" type="text" value="1000" />
<script type="text/javascript">
　　$(function() {
　　　　$('#price1').spinner();
　　});
</script>

上限下限/単位設定

<input id="price2" type="text" value="1000" />
<script type="text/javascript">
　　$(function() {
　　　　$('#price2').spinner({
　　　　　　max: 1500,　　※上限
　　　　　　min: 100,　　※下限
　　　　　　step: 10　　※変更単位
　　　　});
　　});
</script>

通貨、桁区切り

<input id="price3" type="text" value="1000" />
※通貨、桁区切りを設定するためのJavaScriptを参照
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/globalize/0.1.1/globalize.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/globalize/0.1.1/cultures/globalize.culture.ja-JP.js"></script>
<script type="text/javascript">
　　$(function() {
　　　　$('#price3').spinner({
　　　　　　culture: 'ja-JP',　　※通貨
　　　　　　numberFormat: 'c',　　※桁区切り
　　　　　　max: 1500,
　　　　　　min: 100,
　　　　　　step: 10
　　
　　　　});
　　});
</script>