jQuery Mobile 表單

jQuery Mobile 會自動為 HTML 表單自動添加樣式，讓它們看起來更具吸引力，觸摸起來更具友好性。

jQuery Mobile 表單結(jié)構(gòu)

jQuery Mobile 使用 CSS 為 HTML 表單元素添加樣式，讓它們更具吸引力，更易于使用。

在 jQuery Mobile 中，您可以使用下列表單控件：

• 文本輸入框
• 搜索輸入框
• 單選按鈕
• 復(fù)選框
• 選擇菜單
• 滑動條
• 翻轉(zhuǎn)撥動開關(guān)

當(dāng)使用 jQuery Mobile 表單時，您應(yīng)當(dāng)知道：

• <form> 元素必須有一個 method 和一個 action 屬性
• 每個表單元素必須有一個唯一的 "id" 屬性。id 必須是整個站點所有頁面上唯一的。這是因為 jQuery Mobile 的單頁導(dǎo)航機(jī)制使得多個不同頁面在同一時間被呈現(xiàn)
• 每個表單元素必須有一個標(biāo)簽。設(shè)置標(biāo)簽的 for 屬性來匹配元素的 id

如需隱藏標(biāo)簽，請使用 class ui-hidden-accessible。這在您把元素的 placeholder 屬性作為標(biāo)簽時經(jīng)常用到：

Field 容器

如需讓標(biāo)簽和表單元素看起來更適應(yīng)寬屏，請用帶有 data-role="fieldcontain" 屬性的 <div> 或 <fieldset> 元素包圍 label/form 元素：

	fieldcontain 屬性基于頁面的寬度為標(biāo)簽和表單控件添加樣式。當(dāng)頁面的寬度大于 480px 時，它會自動把標(biāo)簽放置在與表單控件同一線上。當(dāng)頁面的寬度小于 480px 時，標(biāo)簽會被放置在表單元素的上面。

提示：為了防止 jQuery Mobile 為可點擊元素自動添加樣式，請使用 data-role="none" 屬性：

	jQuery Mobile 中的表單提交 jQuery Mobile 通過 AJAX 自動處理表單提交，并將試圖集成服務(wù)器響應(yīng)到應(yīng)用程序的 DOM 中。

相關(guān)閱讀

jQuery Mobile 圖標(biāo)