Question

在jQM 1.4中，我有一个包含一堆listitems的listview，每个listitems的结构如下：

<li>
    <a>
        <input type="checkbox">
        <label>
           ...
        </label>
    </a>
    <a></a>
</li>

如果选中了可见的listitem复选框，我想将两个<A>标签的背景颜色更改为黄色，如果未选中则将其更改为白色（我指定可见，因为列表项可能会被过滤掉，而且我不会我想影响那些列表项目）。这是我用来执行此操作的代码：

$("#lvMain li input[type=checkbox]:visible:not(:checked)").closest("li").find("a").css({"background":"white"});
$("#lvMain li input[type=checkbox]:visible:checked").closest("li").find("a").css({"background":"yellow"});

这确实有效，但我很想知道是否有更好的方法，因为这看起来有点贵。

谢谢！

Answer 1

你的标记看起来有点尴尬。如果您能够将其更改为：

<ul>
  <li>
    <input type="checkbox">
    <a>Foo</a>
  </li>
</ul>

您可以在CSS中执行此操作：

input[type=checkbox]:checked ~ a {
  background: yellow;
}

<强> Live demo (click).

否则，你的js并不是那么糟糕。它不太可能伤害任何表现。

着色的最佳方式<a> tags?</a>

1 个答案: