简体   繁体   中英

When i click on main menu the sub menu should highlight in php

From many days am trying this but there is no result please help me when i click on main menu sub menu should highlight in php.

<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>
<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>

You should handle the click event or other events you are interested, and toggle class in the event handler.

$(document).ready(function () {
    $('#cssmenu ul ul a').click(function (e) {
        //e.preventDefault();
        $(this).parents('li.has-sub').find('>a').toggleClass('active');
    });
});

Check the jsFiddle example .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM