Jquery mobile jQuery Mobile ListView项目悬停时的颜色不正确 环境 jQuery Mobile 1.3.0 RubyonRails 3.2.12 Chrome和Firefox最新版本或接近最新版本(如果需要,可以获得精确版本) OSXLion 10.8.2 问题

Jquery mobile jQuery Mobile ListView项目悬停时的颜色不正确 环境 jQuery Mobile 1.3.0 RubyonRails 3.2.12 Chrome和Firefox最新版本或接近最新版本(如果需要,可以获得精确版本) OSXLion 10.8.2 问题,jquery-mobile,Jquery Mobile,使用jquerymobile和后端的Rails,我只对列表视图项产生了一种奇怪的悬停效果。下图显示了在鼠标悬停时listview项的外观。如果在listview项的右侧添加图标/按钮,则只有左侧有问题,如第二张图片所示。所有其他具有悬停效果的元素都可以正常工作 证据 不带图标,悬停时(列表视图项): 带图标,悬停(列表视图项): 带图标,悬停(listview项目右图标): 问题: 为什么在悬停时,我的listview项目会变成一个难看的黑色,而不是一个很好的悬停渐变,而其他所有东西似乎都

使用jquerymobile和后端的Rails,我只对列表视图项产生了一种奇怪的悬停效果。下图显示了在鼠标悬停时listview项的外观。如果在listview项的右侧添加图标/按钮,则只有左侧有问题,如第二张图片所示。所有其他具有悬停效果的元素都可以正常工作

证据 不带图标,悬停时(列表视图项):

带图标,悬停(列表视图项):

带图标,悬停(listview项目右图标):

问题: 为什么在悬停时,我的listview项目会变成一个难看的黑色,而不是一个很好的悬停渐变,而其他所有东西似乎都可以毫无问题地处理(包括listview本身的图标/按钮)

代码 下面是我为listview编写的HAML模板代码

%ul{"data-filter" => "true", "data-inset" => "true", "data-role" => "listview"}
- @item.subitem.each do |item|
  %li{"data-theme" => "c"}
    %a{"data-prefetch" => "", "data-transition" => "slide", href: edit_item_subitem_path(@item, subitem), :rel => "external"}
      = item.text
      - if item.set
        %span.ui-li-count.ui-btn-up-c
          ✓
这就是Rails/HAML生成的内容:

<ul data-filter='true' data-inset='true' data-role='listview' data-split-icon='gear' data-split-theme='b'>
<li data-theme='c'>
  <a data-transition='slide' href='/items/5' rel='external'>
    Testing
    <span class='ui-li-count ui-btn-up-c'>
      2
    </span>
  </a>
  <a data-theme='c' href='/items/5/edit'>
    <span class='ui-icon ui-icon-gear ui-icon-shadow'></span>
  </a>
</li>
这里是jQuery Mobile生成的结果“计算”源(我省略了搜索/筛选代码):

谢谢
提前谢谢,如果您需要任何其他信息,请告诉我。另外,我没有标记这个Rails,因为我认为它与Rails没有关系,但是如果我应该标记,或者如果它最终成为根本原因,我会这样标记。

好吧,事实证明,我在最初使用
Rails scaffold
cli命令对应用程序进行原型设计时,不小心留下了scaffolds.css.scs。这就是问题的原因。

您是否更改了覆盖主题。发布listview代码可能会有所帮助。@Omar我没有。我还添加了我的列表视图代码。如果你将鼠标悬停在齿轮图标上,也会发生同样的情况?@Omar否如果你看我的帖子,我会看到一个屏幕截图,显示当你将鼠标悬停在齿轮图标上时发生的正确行为。
<ul data-filter="true" data-inset="true" data-role="listview" data-split-icon="gear" data-split-theme="b" class="ui-listview ui-listview-inset ui-corner-all ui-shadow">
<li data-theme="c" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-icon="false" data-iconpos="right" class="ui-btn ui-btn-icon-right ui-li ui-li-has-alt ui-li-has-count ui-first-child ui-last-child ui-btn-up-c">
    <div class="ui-btn-inner ui-li ui-li-has-alt">
        <div class="ui-btn-text">
            <a data-transition="slide" href="/items/5" rel="external" class="ui-link-inherit">
                Testing
                <span class="ui-li-count ui-btn-up-c ui-btn-corner-all">
                    2
                </span>
            </a>
        </div>
    </div>
    <a data-theme="c" href="/items/5/edit" title="" class="ui-li-link-alt ui-btn ui-btn-icon-notext ui-btn-up-c" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="false" data-iconpos="notext">
        <span class="ui-btn-inner">
            <span class="ui-btn-text"></span>
            <span data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-icon="gear" data-iconpos="notext" data-theme="c" title="" class="ui-btn ui-btn-up-c ui-shadow ui-btn-corner-all ui-btn-icon-notext">
                <span class="ui-btn-inner">
                    <span class="ui-btn-text">
                    </span>
                    <span class="ui-icon ui-icon-gear ui-icon-shadow">&nbsp;</span>
                </span>
            </span>
        </span>
    </a>
</li>
</ul>