フォーム要素の更新と自動初期化

この章では、フォーム要素の更新とフォーム要素の自動初期化の防止について学習します。

フォーム要素の更新

Refreshメソッドは、フォームコントロールの新しい状態を単独で更新し、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";
});

Jquery-mobile-form-refresh-auto-initialization-form

目次