ラジオボタンのオンザフライでのリフレッシュjQueryMobileのスタイル

Question

ラジオボタンの垂直グループのスタイルを変更しようとしています。その1つに追加する新しいテーマが表示されますが、他のテーマから削除するテーマ/残りのテーマは表示されません。離れていない。

私の目標は、選択したラジオボタンのテーマ（関連するコントロール、とにかく）を変更して、選択時にさらに目立たせることです。

<div data-role="content"> 

    ... 

    <fieldset data-role="controlgroup" id="showChooser"> 
     <legend><h3>Which show are you attending?</h3></legend> 

     <input type="radio" name="activeShow" id="activeShow1" value="1" /> 
     <label for="activeShow1"> 
      <h2>Choice 1</h2> 
      <p>03/25/2012 - 03/27/2012</p> 
     </label> 

     <input type="radio" name="activeShow" id="activeShow2" value="2" /> 
     <label for="activeShow2"> 
      <h2>Choice 2</h2> 
      <p>03/25/2012 - 03/27/2012</p> 
     </label> 

     <input type="radio" name="activeShow" id="activeShow3" value="3" /> 
     <label for="activeShow3"> 
      <h2>Choice 3</h2> 
      <p>03/25/2012 - 03/27/2012</p> 
     </label> 

     ... 

    </fieldset> 

    ... 

</div> 

これが表示されている以下のリストになり：

base state http://img.skitch.com/20120319-8wfa4ep6txwdtgjy475k6b5c3k.png

ので、上でクリックし、それらの1つ、私はこのコードを実行している：

$('#showChooser input:radio').click(function(e) { 
    $("#showChooser label").attr('data-theme','c'); 
    $(this).next().attr('data-theme','e'); 
    $("#settings").page(); 
}); 

最初の行は、理論的にはそれらをすべてテーマCの基本状態にリセットし、次に2番目の行が選択された項目を強調表示するはずです。私はこのようなHTMLの変更が行われたので、次は何をする必要があるのか​​は、jQuery Mobileがディスプレイを再解析して更新することです。

最終的に.page()というページ全体をリフレッシュしようと必死になってしまっていることに注意してください。希望の効果は得られません。

使用すると、1つをクリックする最初の時間は、それが所望の効果を有する：

：

しかし、その後のクリックがun-強調するために、以前に選択された行を表示されません。

私は$("#showChooser").listview("refresh")と私が思い出すことのできない他の類似のものも試しましたが、望む効果はありません。だから私は何が間違っている/間違っていますか？

Answer 1

私はまったく同じ問題を抱えていました。

$('#showChooser input:radio').click(function(e) { 
    $("#showChooser label").attr('data-theme','c').removeClass('ui-btn-up-e'); 
    $(this).next().attr('data-theme','e').addClass('ui-btn-up-e'); 
}); 

this jQuery forum postを参照してください。