jQuery Spinner that can display string and number values?

Question

So I want to create a jQuery spinner that increments when clicked but if its value is 0 (or any targeted value, but lets go with 0 ) I want it to display the word 'unlimited' instead of 0, and then when incremented start counting as if 0 was a number, so it will read: unlimited, 1,2,3,4, etc. Is there any way to do this? Ive found methods for counting through the alphabet and the like but changing one value to a string seems rather difficult. here is a fiddle of a basic spinner:

var spinner = $( "#spinner" ).spinner();
$( "#spinner" ).spinner({
    min: -1,
    max: 50,
});

http://jsfiddle.net/nmnx0y7a/1/

Answer 1

One more version:

$("#spinner").spinner({
    min: -1,
    max: 50,
    spin: function(e, ui) {
        if (ui.value == 0) {
            e.preventDefault();
            this.value = "unlimited"
        }
    }
})
.val('unlimited');

Demo: http://jsfiddle.net/nmnx0y7a/9/

Answer 2

This isn't the most elegant solution...but it will work. Hope it helps.

var spinner = $( "#spinner" ).spinner();
$( "#spinner" ).spinner({
    min: -1,
    max: 50,
});
$(document).ready(function(){
    $('#spinner').val("unlimited");
   $(document).click(function(){
       if($("#spinner").val() == 0)
       {
           $("#spinner").val("unlimited");
       }
   });
});

When the document loads it will immediately put the value of the spinner to "unlimited" and then no matter where you click on the document, it will always check to see if its 0 and then change it to "unlimited".

In fact a better solution would be to put the clikc on a div the spinner is inside.