没有在 jquerymobile 中获取列表视图功能答案

【问题标题】：Not getting listview features in jquerymobile没有在 jquerymobile 中获取列表视图功能
【发布时间】：2013-01-04 07:54:00
【问题描述】：

我对 jquerymobile 很陌生。我正在做一个示例，我试图在其中显示一个列表视图，这是我的代码。

<!doctype html>
<html>
<head>

<link rel="stylesheet" href="jquery.mobile-1.2.0.min.css"/>

<script type="text/javascript" charset="UTF-8" src="jquery.js"></script>
<script type="text/javascript" charset="UTF-8" src="jquery.mobile-1.2.0.min.js"></script>

</head>

<body bgcolor="#e8e8e8">


<div data-role="page" id="emplist-page">

<div data-role="header" data-theme="b">
<h1>Employee Details</h1>
</div>

<div data-role="content">

<ul data-role="listview" id="emplist" data-theme="d">
<li data-role="divider">Names</li>
<li data-icon="arrow-r" >Surendra</li>
<li data-icon="arrow-r" >Bala</li>
</ul>

</div>

<div data-role="footer" data-theme="b" data-position="fixed">
<h1>@2012</h1>
</div>

</div>

</body>
</html>

在此我没有获得列表视图的功能，例如分隔符作为分隔符不可见，并且列表项的箭头图标不可见。

这是我得到的输出。

我也添加了 images 文件夹。

我该怎么办？

提前致谢。

【问题讨论】：

标签： jquery html css listview jquery-mobile

【解决方案1】：

你的 li 元素必须有一个子标签，只有这样箭头才会可见，然后你才能使用 data-icon 属性或 data-split-icon 属性以查看 li 图标。如果标签不应该像链接一样使用，请使用 href="#"。

像这样：

        <ul data-role="listview" data-theme="a">
            <li><a href="#">item1</a></li>
            <li><a href="#">item1</a></li>
            <li><a href="#">item1</a></li>
        </ul>

更多相关信息请见here。

看看这个例子：http://jsfiddle.net/Gajotres/Defxd/

现在看看没有标签的：http://jsfiddle.net/Gajotres/LwfJ6/

如果你刚开始看这个link，它是 jQM 的备忘单。

【讨论】：

谢谢兄弟。你拯救了我的一天。

【解决方案2】：

这里有很多列表视图示例，如基本链接列表、嵌套、编号、拆分按钮、列表分隔符、计数气泡等。请查看以下网址。

http://jquerymobile.com/demos/1.2.0/docs/lists/lists-ul.html

【讨论】：