jquery - 单击链接时事件链接颜色不会更改

Question

我在 WordPress 工作。我从数据库中获取了多个数据并将它们放入 anchor 标记中。当我点击链接时，它的颜色没有改变，所以我无法识别哪个链接是事件的？

我的 CSS 是:

.cd-popup-trigger:active {
    color: #000;
}

我的代码是这样的:

<a href="0#" class="cd-popup-trigger" id="cd-popup-trigger_<?php echo $trow->ID; ?>">
     <span class="tooltip-home-item" title="<?php echo  get_post_meta( $trow->ID, 'wpcf-short-description', true );?>">
          <img src="<?php echo $url; ?>" alt="<?php echo $trow->post_title; ?>" width="20px" height="20px" />
          <label for="<?php echo $trow->post_name; ?>">
              <?php echo $trow->post_title; ?>
          </label>
     </span>
</a>

此外，我还使用 jQuery 在单击时显示弹出框。我在鼠标悬停时使用了工具提示。我的网站是here如果你想检查一下。您可以在我的网站上的食物类型下查看。

Answer 1

那么现在您正在将 css 添加到您的事件状态及其工作。但是如果你想添加样式，即使在点击后它仍然存在，那么你将不得不通过 jQuery 添加一个类。

jQuery('.cd-popup-trigger').click(function(){
     jQuery('.cd-popup-trigger').removeClass('active');
     jQuery(this).addClass('active');

});

我还没有测试过，但它应该做的是在“cd-popup-trigger”旁边分配一个类，当你点击其他元素时，它会删除前一个并将其分配给新元素。

现在你只需要在你的CSS中设置样式

.cd-popup-trigger.active label {
    color: red;
}