jQuery ui微調 - 使用時間（小時）

Question

使用jQuery 1.9.1 & jQuery-ui 1.10.3。想要使用微調控制一段時間（小時）。除了擁有一組有限的值之外，我還想讓它在超過23的時候滾動到0。我遇到的問題是什麼時候開始。

我用微調的代碼：

$(function() { 
    $("#mystarttime").spinner({ 
     numberFormat: "d2", 
     spin: function(event, ui) { 
      if (ui.value > 23) { 
       $(this).spinner("value", 0); 
       return false; 
        } 
      else if (ui.value < 0) { 
       $(this).spinner("value", 23); 
       return false; 
        } 
      console.log("start spin - " + ui.value); 
      } 
     }); 
}); 

輸入：

<label for="mystarttime">Start Time (hr):</label> 
<input type="text" id="mystarttime" name="startTimeVal"> 

頁面加載時，Spinner具有什麼也沒有。如果單擊微調器上的向上箭頭（增加），spin事件觸發&我在控制檯中收到一條消息，顯示值（1）。但是，如果我單擊微調器上的向下箭頭，spin事件不會觸發，但我在輸入框中獲得了23。直到我再次單擊向下箭頭，spin事件觸發，並且輸入（和控制檯）都顯示22.

如果我單擊向下箭頭一次，輸入框顯示23（但沒有事件觸發）。 之後，如果我單擊向上箭頭一次，輸入顯示00（但沒有事件觸發）。

我一定是做錯了事，或者看錯事件來檢測翻轉&的變化，但還沒有找到一個很好的例子，它們都翻轉並看到事件。希望對如何解決這個問題有任何想法或建議。

Answer 1

spin:在您自己設置值時未被調用。但change:被稱爲 - 這應該做的伎倆：

function log(value) { 
console.log(value); 
} 

$(function() { 
    $("#mystarttime").spinner({ 
     numberFormat: "d2", 
     spin: function(event, ui) { 
      if (ui.value > 23) { 
       $(this).spinner("value", 0); 
       return false; 
        } 
      else if (ui.value < 0) { 
       $(this).spinner("value", 23); 
       return false; 
        } 
      log(ui.value); 
     }, 
     change: function(event, ui) { 
      log($(this).spinner("value")); 
     } 
     }); 

});