0

私は 2 つの HTML リストを持っています。1 つは「アクティブな」クラスを選択するために必要で、もう 1 つはそれを無視するために必要です。

これが私のcssです。画像「icon-plus.gif」を表示し、ユーザーがliをクリックすると画像が「icon-minus.gif」に変わります

    li:before {content: url("icon-plus.gif");}
    li.active:before {content: url("icon-minus.gif");}

そして、2つのリストがあり、クリックするとすべてのリストに「icon-plus.gif」という画像が表示されます。

<ul>
  <li>Coffee</li>
  <li>Milk</li>
</ul> 

<ul>
  <li>Bread</li>
  <li>Apples</li>
</ul>

両方とも画像を表示しています!!! 理由が本当にわかりません。私の考えでは、liの中にクラスがありました。

<ul>
  <li class"active">Coffee</li>
  <li class"active">Milk</li>
</ul>

コードはインターネットからダウンロードされました。ありがとう

4

2 に答える 2

1

JQuery を使用します。

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$("li").click(function () {
  // Remove active class from all li elements
  $("li").removeClass("active");
  // add the active class to your clicked on element
  $(this).addClass("active");
});
</script>
于 2012-07-24T18:33:44.190 に答える
0

javascript onclick() イベントと jquery の css 操作が役立つ場合があります。ここに便利なリンクがあります：

http://api.jquery.com/category/css/

于 2012-07-24T18:31:44.340 に答える