JQuery Mobileでページ間でトグル選択を同期する方法は？

Question

私は複数ページのhtmlを持つ必要があり、各ページには同じトグルが含まれています。ユーザーがあるページでトグルを変更すると、他のページのすべてのトグルが変更されます（または少なくとも他のページの読み込み時に変更されます）。

シンプルなシナリオを示すために、各ページに2ページの例と同じトグルを使用して、フィドルを作成しました。私は、多くの方法を試してみた、とそうJavaScriptで操作しようとした後にリフレッシュが含まれているが、ページ1 http://jsfiddle.net/vSr99/

にトグルを切り替えることにより、2ページの切り替えを変更することができるようにしたいのですが私のプログラム的に挑戦された性質のために疑いなく近くに来ていない： -/

誰もが私はそれを感謝したい簡単な解決策を提案することができます！

Thxを

Answer 1

ボタンをクリックすると、そのような$（「HTML」）でこれを保存しているときに、グローバル属性を設定してみてください：

$('html'). attr('toggleIs',true); 

、あなたはpagebforeshowでこれを確認することができ、ボタンの状態に応じて、表示されているすべての新しいページのボタンにトグル状態を追加します。ここ

EDIT
は、（最初​​の警告を無視する）jsfiddleあります。ここで

はhtmlです：

$(document).on('change', '.your_select', function(){ 
    // set 
    if($(this).find('option:selected').val() == "on"){ 
     $('html').data('toggle', 'on'); 
     } else { 
     $('html').data('toggle', 'off'); 
     } 
    }); 

$(document).on('pagebeforeshow', '.ui-page', function(){ 

    var that = $(this).find('.your_select'); 
    // clear 
    that.find('option').removeAttr('selected'); 
    // reset 
    if($('html').data('toggle') == "on"){ 
     alert("should be on") 
     that.find('select option[value="on"]').attr('selected', 'selected') 
     } else { 
     alert("should be off")   
     that.find('option[value="off"]').attr('selected', 'selected') 
     } 
// refresh slider 
... 
}); 

注意してください。

• 私のバインディングが動作しませんでしたので、jqueryの1.6.4を使用して、どこを見て私にしばらく時間がかかりました。あなたが残しておきたい場合は、に引っ張られているページをキャプチャするためのバインディングのためにライブを使用する必要があります。
• 私はすべてのスライダーにクラスを与え、それらを設定するために一緒に
• 私は「（JQMスライダーを取得することはできませんスライダーや親要素で作業するには...あなた自身でそれを理解する必要がありますが、同期は動作しています:-)