0 
<ul data-role="listview">
  <li>Facebook</li>
  <li>Google</li>
  <li>Apple</li>
</ul>

$(document).bind('pagebeforecreate',function(){
  $('form ul li').each(function(){
    $(this).html('<a role="button" data-icon="plus" data-iconpos="left">'+$(this).text()+'</a>');
  });
});

上記のコードは、リストビューを左側にプラスアイコンが付いたボタンのリストに変更する必要があります。しかし、それは私にとってはうまくいきません。は<a...></a>正しく挿入されていますが、アイコンが正しく表示されていません。このデフォルトのアイコンはまだ表示されています。どうすればこれを修正できますか？

4

2 に答える 2

1

上記の @patrick の返信に加えて、ドキュメントに添付した後にボタン ウィジェットを初期化する必要もあります。これを試して、

$(document).bind('pageshow',function(){
  $('ul li').each(function(){
    var $this = $(this);
    $this.html('<a data-role="button" data-icon="plus" data-iconpos="left">'+$this.text()+'</a>');
    var $btn = $('a', $this);
    $btn.button();
  });
});
于 2012-07-25T04:34:41.973 に答える
0

jQuery モバイルドキュメントdata-role="button"によると、アンカー リンクをボタンとしてスタイルするには、属性が必要です。

コードには次のものがあります。

<a role="button"

これは正しくありません。これを次のように変更する必要があります。

<a data-role="button"

したがって、コード全体は次のようになります。

<ul data-role="listview">
  <li>Facebook</li>
  <li>Google</li>
  <li>Apple</li>
</ul>

$(document).bind('pagebeforecreate',function(){
  $('form ul li').each(function(){
    $(this).html('<a data-role="button" data-icon="plus" data-iconpos="left">'+$(this).text()+'</a>');
  });
});
于 2012-07-25T04:23:57.077 に答える