我有这个边栏代码
<li><a href="/restaurant_pos"><span>Restaurant POS Systems</span></a>
<ul>
<li><a href="/restaurant_pos">Restaurant POS Systems</a></li>
<li><a href="/bar_nightclub_pos">Bar and Nightclub POS Systems</a></li>
<li><a href="/bbq-restaurant-pos">BBQ Restaurant POS</a></li>
<li><a href="/bowling-alley-pos-system">Bowling Alley Point of Sale</a></li>
<li><a href="/cafe-pos">Cafe Point of Sale Systems</a></li>
<li><a href="/chinese-restaurant-pos">Chinese Restaurant POS Systems</a></li>
<li><a href="/fine-dining-pos">Fine Dining Point of Sale Systems</a></li>
....
....
我想在当前页面中添加一个活动类,所以这是我采取的方法
<li><a href="/restaurant_pos"><span>Restaurant POS Systems</span></a>
<ul>
<li><a <?php if($_SERVER['REQUEST_URI'] == '/restaurant_pos/'){
echo "class='active' ";
}
?> href="/restaurant_pos">Restaurant POS Systems</a></li>
<li><a
<?php if($_SERVER['REQUEST_URI'] == '/bar_nightclub_pos/'){
echo "class='active' ";
}
?>
href="/bar_nightclub_pos">Bar and Nightclub POS Systems</a></li>
<li><a href="/bbq-restaurant-pos">BBQ Restaurant POS</a></li>
<li><a href="/bowling-alley-pos-system">Bowling Alley Point of Sale</a></li>
<li><a href="/cafe-pos">Cafe Point of Sale Systems</a></li>
<li><a href="/chinese-restaurant-pos">Chinese Restaurant POS Systems</a></li>
<li><a href="/fine-dining-pos">Fine Dining Point of Sale Systems</a></li>
....
....
但我觉得必须有一个更好更干净的方法来做这个…任何想法
最佳答案
这在JavaScript/jQuery中可能更容易实现。保持交互客户端也将节省服务器请求(尽管在负载更高的站点上这可能更令人担心)。
类似于这样-您可能需要根据站点的URL调整url
数组的位置:
jsfiddle:http://jsfiddle.net/g_thom/AXm6e/2/
var pathname = window.location.href;
var partsArray = pathname.split('/');
var url = '/' + partsArray[3];
var a_s = $('li a');
a_s.removeClass('active');
a_s.each(function () {
if ($(this).attr('href') == url) {
$(this).addClass('active');
}
});
关于php - 有没有一种更清洁的方法来使每页的侧边栏处于事件状态?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/6748576/