Question

我正在尝试将搜索功能添加到jquery mobile中，并且我成功添加并且工作正常。现在我得到的问题是显示。现在我的联系人列表显示为段落类型在每个联系人下划线，而在点击搜索按钮后，搜索列表后会刷新到listview，这也是我想要在之前显示的内容..

这是小提琴演示.. Fiddle

这是HTML ..

<ul data-role="listview" data-filter="true" data-inset="true" data-input="#autocomplete-input" id="ContactList">       
</ul>

请帮我解决这个问题.. 感谢..

参考文件。

<link rel="stylesheet" href="css/jquery.mobile.structure-1.0.1.css" />
<link rel="stylesheet" href="css/custom.css" />
<link rel="stylesheet" href="css/jquery.mobile-1.0.1.css" />
<link rel="apple-touch-icon" href="images/launch_icon_57.png" />
<link rel="apple-touch-icon" sizes="72x72" href="images/launch_icon_72.png" />
<link rel="apple-touch-icon" sizes="114x114" href="images/launch_icon_114.png" />
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/jquery.mobile-1.0.1.min.js"></script>
<script src="js/function.js"></script>
<script src="cordova.js"></script>

Answer 1

看起来以下CSS将为您删除下划线：

ul[data-role=listview] a {
  text-decoration: none;
}

所有这一切都是告诉页面从列表视图中的锚链接中删除下划线。

希望有所帮助。

<强>更新

我现在明白了这个问题。好的，所以你只是错过了jQuery Mobile正在应用的一些类。

如果您更改了JavaScript的这一行，它会出现您的期望：

$('#ContactList').append('<li><a href="#" class="ui-btn ui-btn-icon-right ui-icon-carat-r"><h3 class="ui-li-heading">' + name + '</h3><div class="ui-li-desc">Club ' + phone + '</div></a></li>');

重要的是，我们将class="ui-btn ui-btn-icon-right ui-icon-carat-r"添加到您通过JavaScript注入DOM的<a href="#">元素中。

<强> Fiddle with the proper display here

那应该解决它。

显示到ListView问题

1 个答案: