jQuery Mobile 是一個基于 jQuery 構建的開源框架,主要用于支持在移動設備上構建 Web 應用程序。其中一個重要的組成部分就是表單。下面將介紹 jQuery Mobile 表單的使用方法。
首先,需要在 HTML 中引入 jQuery Mobile 的 CSS 和 JS 文件。
<link rel="stylesheet" > <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script><script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>然后,在頁面中添加表單元素。可以使用常用的表單元素,如輸入框、單選按鈕、多選框等,也可以使用 jQuery Mobile 提供的自定義表單元素。
<form><label for="name">姓名:</label><input type="text" name="name" id="name"><fieldset data-role="controlgroup" data-type="horizontal"><legend>性別:</legend><input type="radio" name="gender" id="male" value="male"><label for="male">男</label><input type="radio" name="gender" id="female" value="female"><label for="female">女</label></fieldset><fieldset data-role="controlgroup"><legend>愛好:</legend><input type="checkbox" name="hobby" id="reading" value="reading"><label for="reading">閱讀</label><input type="checkbox" name="hobby" id="music" value="music"><label for="music">音樂</label></fieldset><select name="city" id="city" data-native-menu="false"><option value="beijing">北京</option><option value="shanghai">上海</option><option value="guangzhou">廣州</option></select><input type="submit" value="提交"></form>上述代碼中,使用了 `data-role` 屬性和 `data-type` 屬性來指定自定義表單元素的類型和角色。`data-native-menu="false"` 屬性可以使 `