淘先锋技术网

首页 1 2 3 4 5 6 7

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控件,我们可以在移动设备上方便地展示选项,并获得用户所选项目的值。