0

基本上我有一个导航菜单，目前如果我去网站上的一个页面，它会在导航菜单项中添加“当前”类，这样我就可以改变它的样式。像这样：

jQuery(document).ready(function($){
    var path = window.location;
    $('#nav a[href="'+path+'"]').addClass('current');
});

我想扩展它以包括它下面的任何页面。我遇到了一些解释你如何做到这一点的帖子，但似乎对我不起作用。URL 很长，并且该站点大量依赖 url 中的参数，因此类型 url 可能是 example.com/path1/path2/?id=9238293&name=test。

不确定 jquery 是否是最好的方法？如果可能的话，也可以用 PHP 来做。

4

1 回答 1

0

你可以在 PHP 中有这个： 

<?php
       //$url =  'http://example.com/path1/path2/?id=9238293&name=test';
       $url = $_POST['path'];

       //REMOVE THE LAST PARAMETER IN URL ?id=9238293&name=test';
       $paths = explode('?',$url);

       $paths = count($paths) ? $paths[0] : $paths; //if have parameter or not

       $paths = explode('/', $paths); //SEPARATE THE URL
       if (!$paths[count($paths)-1]){
         unset($paths[count($paths)-1]); //VERIFY IF THE URL ENDS WITH '/'
       }

       $count = count($paths);
       //THEN YOU HAVE
       //YOUR CURRENT PAGE
       //print "Current page: ".$paths[$count-1];
       //print "Mother page: ".$paths[$count-2];
       //THEN YOU CAN COMPARE THE MOTHER PAGE WITH ONE EXISTING MENU PAGE

       //IN YOUR EXAMPLE YOU CAN GO:
       $return = array();
       $site = "http://example.com/";
       $current = $paths[$count-1];
       $mother = $paths[$count-2];
       $return['current'] = $site.$mother.'/'.$current; //THAT WAY YOU STRIP THE PARAMETERS TO GET THIS ON YOUR JAVASCRIPT
       $return['mother'] = $site.$mother;
       print json_encode($return);exit;
?>

然后在你的客户端做：

<script>
    jQuery(document).ready(function($){
        var path = window.location;
        //very important!
        path = path.toString();
        $.post('YOUR PHP SCRIPT URL',{path:path},function(data){
                $('#nav a[href="'+data.current+'"]').addClass('current');
                $('#nav a[href="'+data.mother+'"]').addClass('current');
        },'json');      
    });
</script>
于 2013-09-17T14:58:17.577 回答