0

I would like to have an icon on the left and a text on the right, without using the button markup but rather using div or span.

i dont see how to do that in the doc, i tried doing that :

<a href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="left">Left</a>

replacing the a tag with div or span but it doesnt show any icon

jsbin

4

1 に答える 1

0

私の側ではこれ：

<a href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="left">my text</a>

これと同様に

<div href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="left">my text</div>

アイコン付きのボタンを作成します。Firefox と Chrome の両方を試しました。ここを参照してください: http://jsbin.com/eVaGisA/5/ (更新リンクが機能しなくなりましたが、今は問題ないはずです)

スニペット出力

マークアップが必要ですdata-role="button"。こちらのドキュメントを読むと、次のように書かれています。

入力ベースのボタン、ツールバーのリンク、およびボタン要素は自動拡張され、データの役割は必要ありません。

したがって、divanda要素にはそれが必要です。

更新 2 - 折りたたみ可能なヘッダーにカスタム アイコンを適用する場合

折りたたみ可能なヘッダーの場合、jquery mobile は data-collapsed-icon および data-expanded-icon 属性を提供します。ユースケースは次のとおりです。

<div data-role="collapsible" data-collapsed-icon="arrow-r" data-expanded-icon="arrow-d" >
   <h3>Header1</h3>
   <p>Content 1</p>
   <p>Content 2</p>
</div>

jsfiddle デモ

于 2013-09-04T07:46:37.327 に答える