1

我正在为我的应用程序使用 Jquery mobile。我在页面的一部分中使用它,但我发现它正在破坏我的列表视图的格式。

我有以下基本格式(底部小提琴)

   <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 中,将有一个复选框和两个内联的小按钮。我希望它一直占用最小的空间。

问题:只要我不选中“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 回答