button
a要素にdata-role=”button”を指定するとリンクをボタンとして利用できます。
<a href="index.html" data-role="button">Link button</a>この属性を指定した際に書き出されるHTMLはjQuery Mobile 1.4で大幅に変更されました。
jQuery Mobile 1.3.2
jQuery Mobile 1.3.2では以下の様なHTMLが書きだされます。
<a href="index.html" data-role="button" data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-theme="c" class="ui-btn ui-shadow ui-btn-corner-all ui-btn-up-c">
<span class="ui-btn-inner">
<span class="ui-btn-text">Link button</span>
</span>
</a>jQuery Mobile 1.4.0
これまではjQuery Mobileが要素の構成を変更していたのに対して、jQuery Mobile 1.4.0では大幅に改善され要素の変更はおこなわれずに属性のみを追加し以下の様なHTMLが書きだします。
<a href="index.html" data-role="button" class="ui-link ui-btn ui-shadow ui-corner-all" role="button">Link button</a>また、jQuery 1.4からはdata-role=”button”を指定せず、class=”ui-btn”を追加するだけでボタン形状にすることが可能になりました。
このボタンにはdata-icon属性でアイコンの指定や、data-iconpos属性でアイコンの位置を指定することができます。
jQuery Mobile 1.4.0での追加/変更jQuery Mobile 1.4で書きだされるHTMLが大幅に変更されました。
登録日 : 2012年10月11日 最終更新日 : 2016年12月19日