Question

我是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>

在这里，我没有得到listview的功能，例如分隔符不能作为分隔符显示，并且列表项目的箭头图标不可见。

这是我得到的输出。

enter image description here

我也添加了images文件夹。

我该怎么办？

提前致谢。

Answer 1

您的li元素必须在其中包含子标记，然后才会显示箭头，然后您才能使用 数据图标 属性或 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的备忘单。

Answer 2

以下是listview的大量示例，如基本的链接列表，嵌套，编号，拆分按钮，列表分隔符，计数气泡等。请查看以下网址。

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

没有获得jquerymobile中的listview功能

2 个答案: