首页 > 解决方案 > 在 php 文件中使用 php 更改选定的选项卡(li 元素)颜色

问题描述

我有一个ul li用于显示菜单的 header.php 文件,其中菜单项来自使用 php 访问的数据库。我已经看到选定的选项卡颜色更改,但其中大多数是使用 javascript 或 css 完成的,但其中的列表项以 html 形式给出。

ul这是实现菜单的 html项:

<body >
<!-- Start main menu BODY section -->
<center>
<ul id="css3menu1" class="topmenu">
    <?php echo $show_menu;?>
</ul></center>
<!-- End main menu BODY section -->
</div>

这里是显示菜单 php 代码:

<?php
    $page_sql="SELECT * FROM na_links where sort_order in (1,2,3,4,5,6,7,8,9) order by sort_order ASC limit 0,9";
    $page_q=mysql_query($page_sql);
    while($page_r=mysql_fetch_array($page_q))
    {       
            $page_id = $page_r['na_id'];
            $page_name = $page_r['na_menu'];
            if($page_id==1){ 
                                $show_footer_menu .= "<a href=\"home.php?page_id=$page_id\" class=\"fotterlink\">".$page_name."</a>|";
                                $show_menu .= "<li class=\"topmenu\"><a href=\"home.php?page_id=$page_id\" style=\"height:18px;line-height:18px;\"><span>". ucwords($page_name) . "</span></a></li> ";
                                                             }
            elseif($page_id==2 || $page_id==6) {
                $show_footer_menu .= "<a href=\"static_data_page.php?static_id=$page_id\" class=\"fotterlink\">".$page_name."</a>|";
            $show_menu .= "<li class=\"topmenu\"><a href=\"static_data_page.php?static_id=$page_id\" style=\"height:18px;line-height:18px;\">". ucwords($page_name) . "</a></li>";   }

            elseif($page_id==8) {
                $show_footer_menu .= "<a href=\"contact_us.php\" class=\"fotterlink\">".$page_name."</a>";
            $show_menu .= "<li class=\"topmenu\"><a href=\"contact_us.php\" style=\"height:18px;line-height:18px;\">". ucwords($page_name) . "</a></li>";    }
            elseif($page_id == 46) 
                { 
            $show_menu .="<li class=\"topmenu\"><a href=\"static_data_page.php?static_id=$page_id\" style=\"height:18px;line-height:18px;\" >" . ucwords($page_name) . "</a></li>"; 
                }                                                      
            else {
                $show_footer_menu .= "<a href=\"content.php?page_id=$page_id\" class=\"fotterlink\">".$page_name."</a>|";
            $show_menu .= "<li class=\"topmenu\"><a href=\"content.php?page_id=$page_id\" style=\"height:18px;line-height:18px;\">". ucwords($page_name) . "</a></li>";      }

    }
?>
<!------------------------------ End of menu---------------------------->

我尝试更改显示菜单 php id 1 样式中的背景颜色,但是,它在选择时不会更改它,但会保持该颜色更改。

 if($page_id==1){ 
 $show_menu .= "<li class=\"topmenu\"><a href=\"home.php?page_id=$page_id\" style=\"height:18px;line-height:18px background-color:blue;\"><span>". ucwords($page_name) . "</span></a></li> ";

有什么帮助吗??

如果我使用 JS 来做,我如何从 php 中获取类名,就像我通过类名(hbtn)获取 document.get 元素时一样,JS 函数找不到这个类名

<script>
// Add active class to the current button (highlight it)
var header = document.getElementById("css3menu1");
var btns = header.getElementsByClassName("hbtn");
for (var i = 0; i < btns.length; i++) {
  btns[i].addEventListener("click", function() {
  var current = document.getElementsByClassName("active");
  if (current.length > 0) { 
    current[0].className = current[0].className.replace(" active", "");
  }
  this.className += " active";
  });
}
</script>

这是在php中添加的类名

$show_menu .= "<li class=\"topmenu hbtn\"><a href=\"content.php?page_id=$page_id\" style=\"height:18px;line-height:18px;\">". ucwords($page_name) . "</a></li>";     

标签: phphtmlcsstabs

解决方案


在不了解有关应用程序的更多详细信息的情况下,很难为您提供更具体的答案。

由于您已指定不想使用 JS 来执行此操作,因此可能值得检查superglobals。更具体地说$_SERVER

如果您var_dump($_SERVER);在该脚本的开头,您应该看到请求的脚本是什么,并且可能可以编写一个函数来检查它以应用一些基于此的样式。

就个人而言,我可能会打算用 JS 和 CSS 来做这件事,但我也明白这并不总是可能的。请记住,$_SERVER变量很容易被欺骗,如果可能的话,你应该尽量避免它们(尤其是任何关键业务,如授权)。

随着您对 PHP(或任何服务器端脚本)越来越有信心,您应该开始尝试将视图/表示逻辑与业务逻辑分开。

我希望这会有所帮助,如果没有,请告诉我。


推荐阅读