刷新和表单元素自动初始化

在本章，我们将学习如何刷新表单元素和阻止表单元素自动初始化。

刷新表单元素

刷新方法用于由表单控件本身更新新的状态，并使用 JavaScript 更新表单控件。以下代码片段用于不同的表单元素 −

复选框

$( "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" );

阻止表单元素自动初始化

包含属性 data-role = "none" 来修改用于阻止自动初始化的选择器。将 data-role = "none" 属性与 mobileinit 事件绑定，以载入第一页以及后续页面。

<label for = "test">
<select id = "test" name = "test" data-role = "none">
   <option value = "Mumbai">Mumbai</option>
   <option value = "Pune">Pune</option>
   <option value = "Belgaum">Belgaum</option>
   <option value = "Chennai">Chennai</option>
   <option value = "Bangalore">Bangalore</option>
</select>

$( document ).bind( "mobileinit", function() {
   $.mobile.page.prototype.options.keepNative = "select, input.test, textarea.bar";
});