下拉菜单不在子页面上工作？

Question

下拉菜单不在子页面上工作？但它在主页上运行良好。

这是我的HTML代码：

<div class="helpline-cont">                  
    <div id="dd" class="wrapper-dropdown-client" tabindex="1">
        <span><img src="images/tms-icon1.png" alt="Client Login">Client Login</span>
        <ul class="dropdown">
            <li><a href="travel-management-system.html" title="Main Login" target="_blank">Main Login</a></li>
            <li><a href="../client/login.html" title="Lite Login" target="_blank">Lite Login</a></li>
        </ul>
    </div>
</div>

<div class="helpline-cont" style="margin:0;">                  
    <div class="wrapper-dropdown-3" tabindex="2">
        <span><img src="images/helpline-icon.png" alt="Ezeerooms Helpline">Support</span>
        <ul class="dropdown">
            <li><a href="#">USA: 1 800 594 7894</a></li>
            <li><a href="#">Others: +91 33 40715560</a></li>
        </ul>
    </div>
</div>

jQuery代码：

<script>
    $(function () {

        $('#dd').on('click', function(event){
            event.stopPropagation();
            $('.wrapper-dropdown-client').toggleClass('active');
        });    

        $(document).click(function () {
            // all dropdowns
            $('.wrapper-dropdown-client').removeClass('active');
        });    
    });
</script>

这是CSS：

.wrapper-dropdown-client {
    position:relative;
    width:127px;
    height:33px;
    margin:0 auto;
    padding:0 15px;
    background:#579b0f;
    cursor:pointer;
    outline:0;
    font-weight:400;
    color:#d1d3d4
}
.wrapper-dropdown-client:after {
    position:absolute;
    right:15px;
    top:51%;
    margin-top:-3px;
    border-width:5px 5px 0;
    border-style:solid;
    border-color:#d1d3d4 transparent
}
.wrapper-dropdown-client .dropdown {
    position:absolute;
    width:190px;
    top:100%;
    left:0;
    right:0;
    background:#579b0f;
    color:#ececec;
    font-weight:400;
    -webkit-transition:all .5s ease-in;
    -moz-transition:all .5s ease-in;
    -ms-transition:all .5s ease-in;
    -o-transition:all .5s ease-in;
    transition:all .5s ease-in;
    list-style:none;
    opacity:0;
    pointer-events:none
}
.wrapper-dropdown-client .dropdown li a{
    display:block;
    padding:5px 10px;
    text-decoration:none;
    color:#ececec;
    border-bottom:1px solid #478505;
    -webkit-transition:all .3s ease-out;
    -moz-transition:all .3s ease-out;
    -ms-transition:all .3s ease-out;
    -o-transition:all .3s ease-out;
    transition:all .3s ease-out
}
.wrapper-dropdown-client .dropdown li i {
    float:right;
    color:inherit
} 
.wrapper-dropdown-client .dropdown li:last-of-type a {
    border:none
}
.wrapper-dropdown-client .dropdown li:hover a {
    background:#71b925;
    color:#ececec
}
.wrapper-dropdown-client.active .dropdown {
    opacity:1;
    pointer-events:auto
}
.no-opacity .wrapper-dropdown-client .dropdown,
.no-pointerevents .wrapper-dropdown-client .dropdown {
    display:none;
    opacity:1;
    pointer-events:auto
}
.no-opacity .wrapper-dropdown-client.active .dropdown,
.no-pointerevents .wrapper-dropdown-client.active .dropdown {
    display:block
}
.wrapper-dropdown-client:focus .dropdown {
    opacity:1;
    pointer-events:auto
}

.wrapper-dropdown-3 {
    position:relative;
    width:100px;
    margin:0 auto;
    padding:0 15px;
    background:#0b4691;
    cursor:pointer;
    outline:0;
    font-weight:400;
    color:#d1d3d4
}
.wrapper-dropdown-3:after {
    position:absolute;
    right:15px;
    top:51%;
    margin-top:-3px;
    border-width:5px 5px 0;
    border-style:solid;
    border-color:#d1d3d4 transparent
}
.wrapper-dropdown-3 .dropdown {
    position:absolute;
    width:190px;
    top:100%;
    left:0;
    right:0;
    background:#0b4691;
    color:#d1d3d4;
    font-weight:400;
    -webkit-transition:all .5s ease-in;
    -moz-transition:all .5s ease-in;
    -ms-transition:all .5s ease-in;
    -o-transition:all .5s ease-in;
    transition:all .5s ease-in;
    list-style:none;
    opacity:0;
    pointer-events:none
}
.wrapper-dropdown-3 .dropdown li a {
    display:block;
    padding:5px 10px;
    text-decoration:none;
    color:#d1d3d4;
    border-bottom:1px solid #1e61b6;
    -webkit-transition:all .3s ease-out;
    -moz-transition:all .3s ease-out;
    -ms-transition:all .3s ease-out;
    -o-transition:all .3s ease-out;
    transition:all .3s ease-out
}
.wrapper-dropdown-3 .dropdown li i {
    float:right;
    color:inherit
}
.wrapper-dropdown-3 .dropdown li:last-of-type a {
    border:none
}
.wrapper-dropdown-3 .dropdown li:hover a {
    background:#1e61b6;
    color:#d1d3d4
}
.wrapper-dropdown-3.active .dropdown {
    opacity:1;
    pointer-events:auto
}
.no-opacity .wrapper-dropdown-3 .dropdown,
.no-pointerevents .wrapper-dropdown-3 .dropdown {
    display:none;
    opacity:1;
    pointer-events:auto
}
.no-opacity .wrapper-dropdown-3.active .dropdown,
.no-pointerevents .wrapper-dropdown-3.active .dropdown {
    display:block
}
.wrapper-dropdown-3:focus .dropdown {
    opacity:1;
    pointer-events:auto
}