jQueryMobileのテキスト
jQuery Mobileを使用してフォーム部品のテキストを表示します。
必ずラベリングします。

<div data-role="content">
  <div data-role="fieldcontain">
    <label for="txt">入力:</label>
    <input type="text" id="txt" />
  </div>
</div>


ボタンのDEMOです。

jQueryMobileのテキストをクリアする
jQueryMobileのテキストボックスに何か入力すると、右側に×マークのクリアボタンを表示することができます。
input属性にdata-clear-btn="true"を追加します。

<div data-role="content">
  <div data-role="fieldcontain">
    <label for="txt">入力:</label>
    <input type="text" id="txt" data-clear-btn="true" />
  </div>
</div>


テキストのリサイズのDEMOです。

jQueryMobileのテキストのラベルを非表示
デザイン的な観点からラベルを非表示にしたい場合があります。その場合、div要素にclass="ui-hide-label"を指定します。

<div data-role="content">
  <div data-role="fieldcontain" class="ui-hide-label">
    <label for="txt">入力:</label>
    <input type="text" id="txt" data-clear-btn="true" />
  </div>
</div>


テキストのDEMOです。

Back to top

Information