如何将类应用于导航中的选定项?

时间:2014-11-29 00:40:04

标签: javascript php jquery

我搜索了同一问题的各种答案,但没有一个适合我的问题。我有一个部分硬编码和数据库驱动的导航,我想将一个类应用于已单击的项目。我尝试了这个简单的JS函数,但它没有用。

<ul id="menu">
    <li onclick="funk(this)"><a href="index.php">Home</a></li>
    <?php
    $query=mysqli_query($conn,"SELECT * FROM categories");
    while($row=mysqli_fetch_array($query)){
    $cat_id=$row['cat_id'];
    $cat_title=$row['cat_title'];
    echo "<li onclick='funk(this)'><a href='index.php?cat=$cat_id'>$cat_title</a></li>";
    }
    ?>
</ul>

function funk(el) {
    var kids = document.getElementById("menu").children;
    for(var i = 0; i < kids.length; i++){
       kids[i].className="c1";
    }
    el.className="c2";
}

.c2{background-color:#f65;}
.c1{background-color:#000;}

任何?

1 个答案:

答案 0 :(得分:1)

或者,你可以使用$_GET['cat']来了解你现在的位置,并在while循环中添加一个条件来标记你当前的位置。粗略的例子:

while($row = mysqli_fetch_array($query)){

    $cat_id = $row['cat_id'];
    $cat_title = $row['cat_title'];

    $active = (isset($_GET['cat']) && $_GET['cat'] == $cat_id) ? 'c2' : 'c1'; // class switches
    echo "<li class='$active'><a href='index.php?cat=$cat_id'>$cat_title</a></li>";
}