jquery mobile是一個用于移動設備的開源用戶界面框架,它具有靈活、易于使用和高度可定制的特點。在jquery mobile中,radio控件被用于以單選按鈕組的形式展示選項,用戶只能選擇其中一個選項。
在jquery mobile中,通過使用radio控件,我們可以很方便地獲取用戶所選的選項。下面是一個示例代碼:
<fieldset data-role="controlgroup"> <legend>請選擇喜歡的水果:</legend> <label for="radio1"><input type="radio" name="radio-choice" id="radio1" value="apple" checked="checked">蘋果</label> <label for="radio2"><input type="radio" name="radio-choice" id="radio2" value="orange">橙子</label> <label for="radio3"><input type="radio" name="radio-choice" id="radio3" value="banana">香蕉</label> </fieldset> <script> $(document).on("pagecreate", function(){ $("input[name='radio-choice']").on("change", function(){ var selected_value = $(this).val(); alert("您選擇的水果是:" + selected_value); }); }); </script>
在上面的示例代碼中,我們首先創建了一個包含三個radio控件的fieldset,每個控件分別代表蘋果、橙子和香蕉三個選項。其中,checked="checked"表示默認選中蘋果選項。
接著,在我們的javascript代碼中,我們通過on方法監聽radio控件的change事件,一旦發生變化,就獲取所選的值并彈出一個提示框,告訴用戶他們選擇了哪個水果。
總而言之,通過使用jquery mobile的radio控件,我們可以在移動設備上方便地展示選項,并獲得用戶所選項目的值。
上一篇css固定位fixed
下一篇禁止網頁緩存css