コンテンツが更新されたときにJQuery Mobileの書式が失われる

Question

まず、getJSONを呼び出して適切なデータをプルダウンします。次に、既存の<a href=""></a>要素を更新するために、次のコードを使用します。

$.getJSON("http://URL.com?unitnumber="+query+"", function(data) { 
    var encounter = $('#encounter'); 
    $.each(data, function(i) { 
     if(i==0){ 
      $('#date1').text(""+data[i].DateDisp+"").trigger('create'); 
     } 
    }); 
}); 

初期<a>要素

が正しくフォーマットされています

しかし、すぐに、私は（そのIDである＃日付1）、私はフォーマットを失うことlink要素内のテキストを更新して。これは

Answer 1

あなたはjQueryのモバイルは、あなたのボタンに追加した構造（<a>タグ）を使用してのみ、ボタンのテキストを置き換えることができます...（「作成」）.triggerを使用しようとしているにもかかわらずです。 jQueryのモバイルがそれをスタイリングした後、下のボタンの例は次のとおり

<a data-role="button" data-theme="c" class="ui-btn ui-btn-corner-all ui-shadow ui-btn-up-c"> 
    <span aria-hidden="true" class="ui-btn-inner ui-btn-corner-all"> 
     <span class="ui-btn-text">Updated Text (6)</span> 
    </span> 
</a> 

注ボタンの上記HTML構造はjQueryのモバイル1.0RC2のためのものです。

ui-btn-textクラスの<span>に注目してください。あなたがしたいのはこの<span>をターゲットにしてテキストを変更することです。<a>タグ全体のテキストを変更しようとすると、ボタンをスタイルする<span>タグが失われます。

だからあなたのセレクタは次のようになります。

$('#date1').find('.ui-btn-text').text(...); 

そして、あなたはスタイリングが失われることはありませんので、.trigger('create')を使用する必要はありません。

ここ

は、上記溶液のjsfiddleです：http://jsfiddle.net/jasper/4DAfn/3/

また、あなたが返されるJSONデータを反復処理し、情報のみの最初の行を使用している場合は、次の交換を検討：

$.each(data, function(i) { 
    if(i==0){ 
     $('#date1').text(""+data[i].DateDisp+"").trigger('create'); 
    } 
}); 

：

$('#date1').text(""+data[0].DateDisp+"").trigger('create'); 

それとも、可能性だけでreturn false;内のあなたの文は（が解除されます場合は10ループ）：

$.each(data, function(i) { 
    if(i==0){ 
     $('#date1').text(""+data[i].DateDisp+"").trigger('create'); 
     return false; 
    } 
});