Question

所以，我在标题中添加了一个弹出菜单，它可以正常工作......实际上除了一件小事之外。对于我的生活，我无法按照我想要的方式显示图标！

在第一个＆lt; li＆gt;中我强行将数据图标放入＆lt; li＆gt;它显示但它没有位于左侧。在其他人中，我将数据图标留在了我已经习惯离开的位置（在其他地方正常工作）并且根本不显示。

有什么建议吗？

<div id="header" data-role="header" data-theme="b">
  <h1>MyApp</h1>
  <a href="#popupMenu" data-rel="popup" data-transition="slide" data-icon="bars" class="ui-btn-right"> Menu </a>
  <div data-role="popup" id="popupMenu" data-theme="b">
    <ul data-role="listview" data-inset="true">
      <li data-icon="gear" data-iconpos="left"><a href="#">Settings</a></li>
      <li><a href="#" data-icon="location">GPS</a></li>
      <li><a href="#" data-icon="info">About</a></li>
    </ul>
  </div>
</div>
<!-- /header -->

JSFiddle

Answer 1

没有为常规列表项定义的data-iconpos属性仅在＆lt;李＆GT; item位于导航栏小部件中：http://www.w3schools.com/jquerymobile/jquerymobile_ref_data.asp

请看看我制作的小提琴：https://jsfiddle.net/xbo8npng/1/

我已使用css将图标放在左侧：

<div id="header" data-role="header" data-theme="b">
  <h1>MyApp</h1>
  <a href="#popupMenu" data-rel="popup" data-transition="slide" data-icon="bars" class="ui-btn-right"> Menu </a>
  <div data-role="popup" id="popupMenu" data-theme="b">
    <ul data-role="listview" data-inset="true">
      <li class="left" data-icon="gear"><a href="#">Settings</a></li>
      <li class="left"><a href="#" data-icon="location">GPS</a></li>
      <li class="left"><a href="#" data-icon="info">About</a></li>
    </ul>
  </div>
</div>

和样式：

 .left a{
        padding-left: 2.5em !important;
        padding-right: 1em !important;
  }
  .left a:after{
        left: 2px;
        right: auto;
  }

我希望这可以帮到你！

Jquery Mobile无法正确显示数据图标

1 个答案: