通過向上/向下按鈕和箭頭鍵處理，為輸入數值增強文本輸入功能。

一、實例

普通的數字選擇器。

代碼

<input id="spinner">
 
<script>
$( "#spinner" ).spinner();
</script>

旋轉器（Spinner），或數步進控件（number stepper widget），是用于處理各種數字輸入的完美控件。它允許用戶直接輸入一個值，或通過鍵盤、鼠標、滾輪旋轉改變一個已有的值。當與全球化（Globalize）結合時，您甚至可以旋轉顯示不同地區的貨幣和日期。

旋轉器（Spinner）使用兩個按鈕將文本輸入覆蓋為當前值的遞增值和遞減值。旋轉器增加了按鍵事件，以便可以用鍵盤完成相同的遞增和遞減。旋轉器代表?全球化（Globalize）的數字格式和解析。

二、鍵盤交互

• UP：對值增加一步。
• DOWN：對值減少一步。
• PAGE UP：對值增加一頁。
• PAGE DOWN：對值減少一頁。

用鼠標點擊旋轉按鈕后，焦點仍停留在文本域中。

當旋轉器不是只讀（）時，用戶可以輸入值，這可能會產生無效的值（小于最小值，大于最大值，增減錯配，非數字輸入）。當增減時，不管通過編程方式還是旋轉按鈕方式，值都會被強制為一個有效值（如需了解詳情，請查看?stepUp()?和?stepDown()?的描述。

三、主題化

旋轉器部件（Spinner Widget）使用?jQuery UI CSS 框架?來定義它的外觀和感觀的樣式。如果需要使用旋轉器指定的樣式，則可以使用下面的 CSS class 名稱：

• ui-spinner：旋轉器的外層容器。
• ui-spinner-input：旋轉器部件（Spinner Widget）實例化的??元素。
• ui-spinner-button：用于遞增或遞減旋轉器值的按鈕控件。向上按鈕會另外帶有一個?ui-spinner-up?class，向下按鈕會另外帶有一個?ui-spinner-downclass。

四、快速導航

1、Options

• culture：設置culture選項 用于解析和格式化值。 如果為null，在Globalize下當前設置的culture將被使用， 可供的culture，請查看Globalize 文檔。 只有當numberFormat選項設置了，才會有關聯。 需要引用Globalize。
• disabled：如果設置為?true，則禁用該 spinner（微調組件）。
• icons：標題要使用的圖標，與?jQuery UI CSS 框架提供的圖標（Icons）?匹配。設置為 false 則不顯示圖標。
• incremental：當按住spinner（微調組件）按鈕不放時，控制的步數。
• max：允許的最大值。 如果元素的max屬性存在，該選項未明確設置，那么該元素的max屬性就被用作該選項的值。 如果為null，表示沒有上限。
• min：允許的最小值。 如果元素的min屬性存在，該選項未明確設置，那么該元素的min屬性就被用作該選項的值。 如果為null，表示沒有下限。
• numberFormat：通過Globalize格式化數字， 如果有效的話。 最常見的用于"n"用作十進制數 和"C"用作貨幣值。 也看到了culture選擇。
• page：當通過pageUp/pageDown的方法進行分頁時，采取的步數。
• step：通過按鈕或stepUp()/stepDown()方法微調時，采取的步數。 如果元素的step屬性存在，并且該選項未明確設置，那么元素的step屬性值將作為該選項的值使用。

2、Methods

• destroy()：完全移除 spinner功能。這會把元素返回到它的預初始化狀態。
• disable()：禁用 spinner.
• enable()：啟用 spinner.
• option()：獲取當前與指定的?optionName?關聯的值。
• pageDown()：通過指定頁數遞減值， 頁數由page選項定義。 如果沒有參數， 單頁遞減。
• pageUp()：通過指定頁數遞增值， 頁數由page選項定義。 如果沒有參數， 單頁遞增。
• stepDown()：通過指定步數遞減值， 步數由step選項定義。 如果沒有參數， 單步遞減。
• stepUp()：通過指定步數遞增值， 步數由step選項定義。 如果沒有參數， 單步遞增。
• value()：獲取或設置當前數值，這個值是基于numberFormat?和?culture選項解析的。
• widget()：返回包含生成組件包裹元素 的一個jQuery對象。

3、Extension Points

• _buttonHtml()：這個方法返回的HTML用于spinner（微調組件）的遞增和遞減按鈕。 每個按鈕都必須給定一個ui-spinner-button的類名 用于相關聯的事件工作。
• _uiSpinnerHtml()：這個方法返回的HTML用于包裹 spinner（微調組件）元素。

4、Events

• change( event, ui )：當spinner微調器的值改變并且輸入元素（input）失去焦點時，該事件觸發。
• create( event, ui )：當spinner微調器創建的時候，該時間觸發。
• spin( event, ui )：在遞增/遞減的時候，該事件觸發（用 當前值和ui.value比較來 確定的微調的方向）。可以取消，以防止被更新值。
• start( event, ui )：微調開始之前，觸發該事件。可以取消，以防止微調。
• stop( event, ui )：微調結束后，觸發該事件。