提问人：shimmyshimmyya7347 提问时间：8/30/2023 最后编辑：shimmyshimmyya7347 更新时间：8/30/2023 访问量：18
单个类元素 jQuery 的活动类
Active class for single class element jQuery
问：
我有这些按钮，它们实际上是网格中的 p 元素，它们都具有相同的类。我想更改用户单击的 p 元素的颜色。如何在jQuery中添加活动类，并且仅选择该类中的一个元素？顺便说一句，我的 html 中有各种“网格”，它们都以相同的方式配置......（因此类网格:-D）
谢谢！
jQuery 变量
const $size = $(".size");
<div id="red-details" class="extra-details">
<p>
The ultimate in style and comfort, the Red Flyer's are great for
walking and casual wearing.
</p>
<h3>Size</h3>
<div class="grid">
<p class="size">7</p>
<p class="size">8</p>
<p class="size">9</p>
<p class="size">10</p>
<p class="size">11</p>
</div>
<button class="add-to-cart">Add To Cart</button>
</div>答：
0赞
Paul T.
8/30/2023
#1
一种方法是拥有指定的 CSS。具有从应用了 CSS 的任何元素（基于您的示例）中删除样式的处理，然后将 CSS 设置为单击的元素，以便只有 1 个元素应用了样式。<p>
试试下面的可运行示例。在示例中，我使用 CSS 作为样式，但您可以根据需要重命名它。.clicked
$(document).ready(function() {
$('p').on('click', function(e) {
// Any <p> that has the clicked CSS, remove it:
$('p.clicked').removeClass('clicked');
// Then apply the CSS to the clicked element
$(this).addClass('clicked');
})
});.clicked {
background-color: yellow;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="red-details" class="extra-details">
<p>
The ultimate in style and comfort, the Red Flyer's are great for
walking and casual wearing.
</p>
<h3>Size</h3>
<div class="grid">
<p class="size">7</p>
<p class="size">8</p>
<p class="size">9</p>
<p class="size">10</p>
<p class="size">11</p>
</div>
<button class="add-to-cart">Add To Cart</button>
</div>评论
0赞
shimmyshimmyya7347
8/30/2023
谢谢保罗！我很感激你的帮助。
评论