jQuery移动列表视图和输入按钮重叠 [英] jQuery mobile listview and input button overlap

问题描述

我具有以下显示项目列表和该列表下方的按钮的信息.但是，该按钮在列表顶部重叠.我一定不要把某种数据角色或它们的另一个属性放在上面.

I have the following to display a list of items and a button underneath the list. However the button is overlapping on top of the list. I must be not putting some kind of data-role or another one of their attributes on it.

<div data-role="content" data-theme="b">    
    <div>
       <ul id="listOfSheets" data-role="listview" >
     <li class="hidden"> <a href="_linkToSheet" data-ajax="false"> _sheetName</a></li>
      </ul>
    </div>  
    <input id="logout" type="button" value="Sign Out"    />
 </div><!-- /content -->

这是它的样子:

推荐答案

实时示例:

• http://jsfiddle.net/B7nhA/(问题)
• http://jsfiddle.net/B7nhA/1/(修复程序)

• http://jsfiddle.net/B7nhA/ (the problem)
• http://jsfiddle.net/B7nhA/1/ (the fix)

您缺少列表视图的属性之一

You're missing one of the attributes for the listview

data-inset="true"

HTML

<div data-role="content" data-theme="b">    
    <div>
        <ul id="listOfSheets" data-role="listview" data-inset="true">
            <li class="hidden"><a href="#" data-ajax="false">Link 1</a></li>
            <li class="hidden"><a href="#" data-ajax="false">Link 2</a></li>
            <li class="hidden"><a href="#" data-ajax="false">Link 3</a></li>
        </ul>
    </div>  
    <input id="logout" type="button" value="Sign Out" />
</div><!-- /content -->

这篇关于jQuery移动列表视图和输入按钮重叠的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！