1

我试图删除默认情况下出现在列表视图中的右箭头。搜索了一段时间，data-icon="false"但没有成功。然后我搜索了更多，发现这篇文章JqueryMobile - Listviews 右箭头（我可能会复制这篇文章，请原谅我）

我的问题是，我如何才能删除 1.0a2 中的箭头？显然这可以使用 DOM 手术来完成，有人可以详细说明吗？

4

2 回答 2

1

对于较新的 jQuery Mobile 版本，只需设置data-icon="false"，另请参阅文档

要完全防止图标出现，请将 data-icon 属性设置为“false”。

在此处输入图像描述

于 2014-09-23T14:43:09.387 回答
0

一种解决方法是使用以下 JS / jQuery 代码“手动”删除箭头：

$(function() {
    $('li').removeClass("ui-btn-icon-right"); 
});

这是一个完整的工作示例，试一试：

<!DOCTYPE unspecified PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile.structure-1.0a2.min.css" />
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" />
    <script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>

    <script>
        $(function() {
            $('li').removeClass("ui-btn-icon-right"); 
        });
    </script>
</head>

<body>
    <div data-role="page" id="p1">
        <div data-role="content">
            <ul data-role="listview" data-theme="a" >                   
                <li><a href="#p2">Go to page 2</a></li>
                <li><a href="#p3">Go to page 3</a></li>
            </ul>
        </div>
    </div>

    <div data-role="page" id="p2">
        Hello! This is page 2!!!
    </div>

    <div data-role="page" id="p3">
        Hello! This is page 3!!!
    </div>

</body>
</html>

但是，我建议获取最新版本的 jQuery Mobile（目前为 1.2），它更正了几个错误，并且以这种方式更稳定。

查看网站了解更多信息：http: //jquerymobile.com/

希望这可以帮助。

于 2012-10-11T00:25:28.857 回答