JSFiddle - React, Tailwind, and code Playground

by Tiago Agostinho

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css">
<input class="selector" name="spinner" />
<br><br>
Calc: <input id="calc" name="calc" value="0" />

JavaScript

$( ".selector" ).spinner({
    	min: 0,
		spin: function( event, ui )
		{
			//Quando passa de 4 ele volta para 0
			if ( ui.value > 4 )
			{
				$( this ).spinner( "value", 0 );
				return false;
			}
			//Ele volta para 4 quando quer ir a <0
			else if ( ui.value < 0 )
			{
				$( this ).spinner( "value", 4 );
				return false;
			}
			//Tentativa de soma que está dando erro	
        	var $soma 		= 0;
			var $calc 		= $("#calc").val();
	        var $new 		= ui.value;
    	    var $old 		= $(".selector").spinner("value");    
			if ($new > $old) 
				$soma = parseInt($calc) + parseInt($new);
			else
				$soma = parseInt($calc) - parseInt($new);
			$("#calc").val($soma);
		}
	});