Javascript 当我点击子菜单时，父菜单应该高亮显示_Javascript_Php_Html_Css

Javascript 当我点击子菜单时，父菜单应该高亮显示

javascript php html css

Javascript 当我点击子菜单时，父菜单应该高亮显示,javascript,php,html,css,Javascript,Php,Html,Css,当我们点击子菜单时，父菜单应该高亮显示。请检查我的Javascript代码。我无法得到结果。这里我得到的结果只是主菜单高亮显示。请帮帮我，先谢谢你 <html> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript"> $(document).ready(function(){

当我们点击子菜单时，父菜单应该高亮显示。请检查我的Javascript代码。我无法得到结果。这里我得到的结果只是主菜单高亮显示。请帮帮我，先谢谢你

<html>
    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        $('#cssmenu a').each(function(index) {
            if(this.href.trim() == window.location)
            {
            //check if 1st level, then below condition
            //if(this.class() != "has-parent")
            //{
               // $(this).addClass("active");
            //} 
                //if not first level, assign active to parent of this
            //if(this.class()= "has-parent")
            //{
                $(this).addClass("active");
            //}     
                }
        });
    });
    </script>
    <style>
     .active{
      background: #4FA9E4; color:#FFF;

    }

    <ul id="id">
    <body>
    <div id="cssmenu">
        <ul>
            <li class="has-sub"><a href="company.php">Company</a>

            <ul><li class="has-parent"><a href="a.php">a</a></li>
            <li><a href="b.php">b</a></li>
            </ul>
            </li>
            <li  class="has-sub"><a href="patners.php">Patners</a>
            <ul><li><a href="c.php">c</a></li>
            <li><a href="d.php">d</a></li></ul>
            </li>

            <li><a href="contactus.php">Contact Us</a></li>
                </ul>
                </div>
    </body>
    </html>


$（文档）.ready（函数（）{
$（'#cssmenu a'）。每个（函数（索引）{
if（this.href.trim（）==window.location）
{
//检查是否为第一级，然后是以下状态
//if（this.class（）！=“具有父级”）
//{
//$（此）.addClass（“活动”）；
//} 
//如果不是第一级，则将“活动”指定给此的父级
//if（this.class（）=“具有父级”）
//{
$（此）.addClass（“活动”）；
//}     
}
});
});
.主动{
背景：4FA9E4；颜色：FFF；
}

您忘记关闭样式标记，这就是问题的原因。我还添加了一些你忘记的标签，比如doctype和head标签。验证您的文档，您将不会再遇到类似的问题

<!doctype html><html><head><title>test</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        $('#cssmenu a').each(function(index) {console.log(this.href);
            if(this.href.trim() == window.location)
            {
            //check if 1st level, then below condition
            //if(this.class() != "has-parent")
            //{
               // $(this).addClass("active");
            //} 
                //if not first level, assign active to parent of this
            //if(this.class()= "has-parent")
            //{
                $(this).addClass("active");
            //}     
                }
        });
    });
    </script>
    <style>
     .active{
      background: #4FA9E4; color:#FFF;display:block;

    }
    </style>
</head><body>

    <div id="cssmenu">
        <ul>
            <li class="has-sub"><a href="company.php">Company</a>

            <ul><li class="has-parent"><a href="a.php">a</a></li>
            <li><a href="#asd">b</a></li>
            </ul>
            </li>
            <li  class="has-sub"><a href="patners.php">Patners</a>
            <ul><li><a href="c.php">c</a></li>
            <li><a href="index.php">d</a></li></ul>
            </li>

            <li><a href="contactus.php">Contact Us</a></li>
                </ul>
                </div>
</body></html>

测试
$（文档）.ready（函数（）{
$（'#cssmenu a'）.each（函数（索引）{console.log（this.href））；
if（this.href.trim（）==window.location）
{
//检查是否为第一级，然后是以下状态
//if（this.class（）！=“具有父级”）
//{
//$（此）.addClass（“活动”）；
//} 
//如果不是第一级，则将“活动”指定给此的父级
//if（this.class（）=“具有父级”）
//{
$（此）.addClass（“活动”）；
//}     
}
});
});
.主动{
背景：#4FA9E4；颜色：#FFF；显示：块；
}

像这样的东西

HTML:

风格：

    .active{
      background: #4FA9E4; color:#FFF;
}

请参见此项。

添加单击功能

 $('#cssmenu a').unbind('click').click(function(){
            $(this).addClass("active");
            return false;
    });

示例

您能将代码粘贴到其中吗？这样我们可能更容易调试您的代码。我没有得到我想要的确切答案。请任何人通过提供正确的代码来帮助我，我首先提供的代码只是突出显示正在单击的内容，但我希望单击子菜单时主菜单应突出显示，请帮助

    .active{
      background: #4FA9E4; color:#FFF;
}

 $('#cssmenu a').unbind('click').click(function(){
            $(this).addClass("active");
            return false;
    });