jQuery的：添加一個類jQuery的微調值改變

Question

我做了什麼：

$(function() { 
    var spinner = $('#spinner').spinner({ 
     min  : -1, 
     max  : 1, 
     spin : function(event, ui) { 
      console.log(ui.value); 
     } 
    }); 
}); 

<input id="spinner" name="value"> 

我想這樣的結果：

If spinner value > 1 && spinner selected class == 'ui-spinner-up' addclass this.'active' 
If spinner value == 0 removeclass 'active' 
If spinner value < 0 && spinner selected class == 'ui-spinner-down' addclass this.'active' 

image

有誰知道這個怎麼做？希望你能理解這個問題。先謝謝你。

Answer 1

希望你正在嘗試做的像這個 -

$('#spinner').change(function(){ 
    var val = $(this).val(); 
    if(val > 1){ 
     $(this).addClass('ui-spinner-up'); 
     $(this).removeClass('ui-spinner-down'); 
     $(this).addClass('active'); 
    }else if(val == 0){ 
     $(this).removeClass('active'); 
    }else{ 
     $(this).addClass('ui-spinner-down'); 
     $(this).removeClass('ui-spinner-up'); 
     $(this).addClass('active'); 
    } 
}); 

Answer 2

東西試試這個：（添加jQuery的ui.css，jQuery的ui.js，的jquery.js）

$(function() {  

    var spinner = $('#spinner').spinner({ 
     min  : -1, 
     max  : 1, 
     spin : function(event, ui) { 
      var val = ui.value; 

      if(val > 0) { 
       $(this).parent().find('a.ui-spinner-up').addClass('active').siblings('.active').removeClass('active'); 
      } else if(val < 0) { 
       $(this).parent().find('a.ui-spinner-down').addClass('active').siblings('.active').removeClass('active'); 
      } else { 
       $(this).parent().find('a').removeClass('active'); 
      } 

     } 
    }); 

}); 

HTML：

<input id="spinner" name="value">