1

アプリケーションに Jquery モバイルを使用しています。ページの一部で使用していますが、リストビューの書式設定が台無しになっていることがわかりました。

私は次の基本的なフォーマットを持っています(一番下のフィドル)

   <ul>
      <li>
         <div id="number1">
            <span></span>
         <div>
         <div id="number2">
             <span><input type="checkbox" /><span>
             <span> something</span>
             <span> something else</span>
         </div>
      </li>
  </ul>

リストビューを作成しています。id="number1" の内側の div は、リストのメイン ラベルになります。id="number2" の内側の div には、チェックボックスと 2 つの小さなボタンがインラインで表示されます。私はこれが右端まで最小限のスペースしかとらないようにしたい.

問題:ページの他の部分に使用している「jQuery Mobile 1.3.0b1」をチェックしない限り、フォーマットは問題ないように見えます。それがクリックされるとすぐに、div w の float:right のようになります。id="number2" は無効になりました。

http://jsfiddle.net/SteveRobertson/ncQFp/39/

フィドルをチェックしてから、jQuery Mobile 1.3.0.b1 をチェックして、私が望んでいない効果を確認してください。

お時間をいただきありがとうございます！

4

1 に答える 1

1 
    .ui-controlgroup-horizontal .ui-controlgroup-controls {
    display: block !important;
    }

<li>
    <div id="jobList"  data-role="controlgroup" data-type="horizontal">
        <div id="labelContainer">
            <span class="labelItem"><a href="#">item 2</a></span>
        </div>
        <div data-role="controlgroup" data-type="horizontal" id="buttonContainer">  
            <span class="checkboxes"><label for="id2"></label><input type="checkbox" id="id2" /></span> 
            <span class="deleteButton"><a href="#"> A</a></span>
            <span class="notesButton"><a href="#"> B</a></span>                                                     
        </div>
    </div>
</li>

jsFiddle の例

どのように見えるかはわかりませんが、これが役立つことを願っています。

于 2013-07-25T13:34:37.633 に答える