Question

使用jquery mobile，我正在尝试重置表单

我使用以下内容：

$('form').prop('selectedIndex',0);

select提交的值确实重置为零，但图像保持原样。

Answer 1

创建与刷新：重要区别
请注意，create事件和刷新方法之间存在重要差异   一些小部件有。 create事件适用于增强原始标记   包含一个或多个小部件。应该使用刷新方法   在已经被操纵的现有（已经增强的）小部件上   以编程方式，需要更新UI以匹配。

例如，如果您有一个动态添加新页面的页面   页面后面带有data-role=listview属性的无序列表   创建，触发该列表的父元素上的创建   将其转换为listview样式的小部件。如果有更多列表项   然后以编程方式添加，调用listview的refresh方法   会将这些新列表项更新为增强状态并离开   现有的列表项目未受影响。

http://jquerymobile.com/demos/1.0.1/docs/pages/page-scripting.html

刷新表单元素
在jQuery Mobile中，一些增强的表单控件只是样式化（输入），但其他是自定义控件（选择，滑块）由本机构建并与其保持同步控制。要以编程方式使用JavaScript更新表单控件，首先操作本机控件，然后使用refresh方法告诉增强控件更新自身以匹配新状态。下面是一些如何更新常用表单控件的示例调用刷新方法：

http://jquerymobile.com/demos/1.0.1/docs/forms/docs-forms.html

复选框：

$("input[type='checkbox']").prop("checked",true).checkboxradio("refresh");

收音机：

$("input[type='radio']").prop("checked",true).checkboxradio("refresh");

选择

var myselect = $("#selectfoo");
myselect[0].selectedIndex = 3;
myselect.selectmenu("refresh");

滑块：

$("input[type='range']").val(60).slider("refresh");

翻转开关（他们使用滑块）：

var myswitch = $("#selectbar");
myswitch[0].selectedIndex = 1;
myswitch.slider("refresh");

尝试：

$('form').prop('selectedIndex',0);
$('form').trigger('create');

或者如果这是一个下拉选择

http://jquerymobile.com/demos/1.0.1/docs/forms/selects/methods.html

JS

$('form').prop('selectedIndex',0);
//refresh value         

$('select').selectmenu('refresh');

//refresh and force rebuild 
$('select').selectmenu('refresh', true);

Answer 2

假设您在select ...上有更改事件，请在编程更改索引后调用更改事件。

Answer 3

假设选择框如：

<select name="opt1">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>

您可以选择所需的选项：

$("select").val("3");

以图形方式重置选择框

3 个答案: