非常简单的 toggleClass 不起作用

Question

所以我有一些非常简单的代码，但它不起作用。

$(function() {
 $("#tren").click(function() {
  $("#trens").toggleClass("show");
 });
});

.show {
    color: "red";
}

<ul>
    <li id="tren">Some text</li>
</ul>
<div id="trens">
    <p>Other text</p>
</div>

'Other text' 应该变红，但它没有变红。我做错了什么？

Answer 1

只需删除 CSS 中的引号。运行下面的代码片段可以看到它的效果。

$(function() {
 $("#tren").click(function() {
  $("#trens").toggleClass("show");
 });
});

.show {
    color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul>
    <li id="tren">Some text</li>
</ul>
<div id="trens">
    <p>Other text</p>
</div>

Answer 2

您需要做的就是从括号中取出 'red' 一词。

.显示{颜色：红色；}

非常简单的 toggleClass 不起作用

Very simple toggleClass not working

html

javascript

jquery

toggleclass