添加基于 ID 的 CSS 类 - Add CSS class based on ID

Add CSS class based on ID

本文关键字：CSS ID 添加 | 更新日期: 2023-09-27

我想知道如何使用 jQuery 根据链接中的 ID 将 CSS 类添加到链接中。如果 if 语句为真，我不想将 CSS 类"active"添加到链接中。并不是说如果语句为真，我不想从链接中的类中删除"pFavorite"，我只想添加活动，就像这个 class="pFavorite active" 我还没有在 jQuery 中。我希望我的代码仍然能解释我想要实现的目标。

<?php
foreach($statement as $p)
{
    if(array_search($p['id'], explode(",", $_COOKIE['cookie'])))
    {
    ?>
    <script type="text/javascript">
        $("#<?php echo $p['id']; ?>", ".pFavorite").addClass("active");
    </script>
    <a href="#" class="pFavorite" id="<?php echo $p['id']; ?>">IMG HERE</a>
<?php 
    } 
}
?>

首先

，你的jQuery选择器是错误的，你可能的意思类似于

$("#<?php echo $p['id']; ?>.pFavorite").addClass("active");

上面会将元素与特定 id 和类 pFavorite 匹配，而您的原始选择器会将所有元素与类 pFavorite 匹配，然后在其中任何一个中查找具有指定 id 的元素，找不到任何内容（因为目标元素是具有类的元素之一，而不是后代）。

其次，你不需要类选择器，因为你已经在使用 id 选择器，并且 id 应该是唯一的。因此，这将进一步简化为

$("#<?php echo $p['id']; ?>").addClass("active");

最后：当你在 PHP 端拥有所需的所有信息时，为什么要在使用 jQuery 加载页面后设置类？你可以简单地做

if(array_search($p['id'], explode(",", $_COOKIE['cookie']))) {
    // Use htmlspecialchars for all HTML output; you may need to specify
    // additional parameters (see the function documentation)
    printf('<a href="#" class="active pFavorite" id="%s">IMG HERE</a>',
           htmlspecialchars($p['id']));
}

为什么不：

<?php
foreach($statement as $p) {
    if(array_search($p['id'], explode(",", $_COOKIE['cookie']))) {
        echo('<a href="#" class="pFavorite active" id="' . $p['id'] . '">IMG HERE</a>');
    } 
}
?>

？

<?php
foreach($statement as $p)
{
    if(array_search($p['id'], explode(",", $_COOKIE['cookie'])))
    {
    ?>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#<?php echo $p['id']; ?>.pFavorite").addClass("active");
        });
    </script>
    <a href="#" class="pFavorite" id="<?php echo $p['id']; ?>">IMG HERE</a>
<?php 
    } 
}
?>