1

jquery mobile の自動レイアウトに問題があります。

私はフィールドセットを持つフォームを持っています:

<div data-role="collapsible" data-collapsed="false" data-theme="a">
<h3>Test</h3>
    <div data-role="fieldcontain">
       <label for="TextInput"> Textinput </label>
       <input type="text" name="TextInput" id="TextInput">
    </div>

    <div data-role="fieldcontain">
       <label for="ButtonInput"> Button </label>
       <a href="javascript:alert('works')" data-icon="arrow-r" data-role="button" data-iconpos="right">
          <label id="ButtonInput" name="ButtonInput"> Testvalue </label>
       </a>
    </div>
</div>

低解像度のディスプレイでは、すべて正常に動作します。ラベルは最初の行に表示され、入力は 2 番目の行に表示されます。

テキスト入力
[入力ボックス]

ボタン
[ボタン]

高解像度のディスプレイでは、入力フィールドとラベルが 1 行で表示されます
。 Textinput [InputBox]

しかし、ボタンはまだ 2 つの行に表示されています:
ボタン
[ボタン]

誰でも問題を知っていますか？

4

1 に答える 1

1

これはエラーではありません。jQM はそのように動作するように構築されています。

修正したい場合は、次の単純な css を使用してください。

#TextInput {
    width: 100% !important;
}

作業例: http://jsfiddle.net/Gajotres/xrVU2/

于 2013-01-31T13:35:50.067 に答える