【问题标题】:Toggle button is not working切换按钮不起作用
【发布时间】:2016-12-20 20:50:09
【问题描述】:

我为导航标签菜单条码添加了切换按钮。它取值但没有返回任何东西。当我单击图标时,它可以工作,但仍然在屏幕上,不会返回........... 请帮我。 这是我的代码..

        <nav class="navbar navbar-default navbar-fixed-top" role="navigation">  
            <div class="container-fluid">

                <!-- Logo & Responsive Menu -->
                <div class="navbar-header">
                    <button type="button" id="nav-toggle" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navigation-menu">
                        <span class="sr-only">Toggle navigation</span> 
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="<?php echo base_url(); ?>"><img src="http://liveyogis.com/assets/img/final-logo-liveyogis.png" alt="logo" role="banner"></a>
                </div>  <!-- End navbar-header -->

                <!-- Navigation -->

                <nav id="navigation-menu" class="collapse navbar-collapse"  role="navigation">
                  <ul class="nav navbar-nav navbar-right">
                  <li <?php if ($active == 'corporate') echo 'class="selected-nav animate_text"'; else 'class="animate_text"'; ?>><a id="GoToClients" href="<?php echo site_url('yoga-for-corporate'); ?>">Yoga For Corporate</a></li>
                    <li <?php if ($active == 'home') echo 'class="selected-nav"'; ?>><a id="GoToHome" class="" href="<?php echo site_url(); ?>">Home</a></li>
                    <li <?php if ($active == 'trainer') echo 'class="selected-nav"'; ?>><a id="GoToAbout" href="<?php echo site_url(); ?>trainers">Trainers</a></li>    
                    <li <?php if ($active == 'about-us') echo 'class="selected-nav"'; ?>><a id="GoToFeatures" href="<?php echo site_url(); ?>about-liveyogis">About Us</a></li>
                    <li <?php if ($active == 'blog') echo 'class="selected-nav"'; ?>><a id="GoToBlog" href="<?php echo site_url(); ?>blog/yoga-blogs">Blogs</a></li>
                    <li <?php if ($active == 'faq') echo 'class="selected-nav"'; ?>><a id="GoToFaq" href="<?php echo site_url(); ?>liveyogis-faq">FAQ</a></li>
                    <li <?php if ($active == 'contact-us') echo 'class="selected-nav"'; ?>><a id="GoToPricing" href="<?php echo site_url(); ?>contact-liveyogis">Contact Us</a></li>    

                    <?php

                            if ($this->session->userdata('user_id')) {
                                ?>
                                <li class="dropdown"><span class=profile_pic>
                                        <?php
                                            /*echo $this->session->userdata('img').' IMAGEii<br/>';*/
                                            if($this->session->userdata('img')){  ?>

                                                <strong> <?php echo substr($this->session->userdata('name'), 0, 6);  ?> </strong>

                                                <img src="http://liveyogis.com/dashboard/uploads/img/users/<?php echo $this->session->userdata('img'); ?>" height="50">


                                        <?php   }
                                            else{
                                                 echo substr($this->session->userdata('name'), 0, 6); 

                                            }
                                        ?>                                            
                                    <ul class="dropdown-content">
                                        <li ><a  href=<?php echo base_url(); ?>dashboard/index.php/liveyogis/dashboard><i class=icon-gear_wheel></i> My Account</a></li>
                                        <li><a href="<?php echo site_url(); ?>login_c/logout_customer"><i class=icon-lock> </i> Logout</a></li>
                                    </ul>
                                </li>
                                <?php
                            } else {
                                ?>
                                <li <?php if ($active == 'login') echo 'class="selected-nav"'; ?>><a href="<?php echo site_url(); ?>login">Login | Register</a></li>
                                <?php
                            }   ?>              

                  </ul>
                </nav>  <!-- End navbar-collapse -->

            </div>  <!-- End container -->
            <br />
        </nav>  <!-- End navbar -->

    </header> 

【问题讨论】:

    标签: javascript jquery header nav


    【解决方案1】:

    您需要添加以下资源才能使其正常工作

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.5/css/bootstrap.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://npmcdn.com/tether@1.2.4/dist/js/tether.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.5/js/bootstrap.min.js"></script> 
    

    我已经删除了你代码的 php 部分并放了一些随机的 html

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.5/css/bootstrap.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://npmcdn.com/tether@1.2.4/dist/js/tether.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.5/js/bootstrap.min.js"></script> 
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">  
                <div class="container-fluid">
    
                    <!-- Logo & Responsive Menu -->
                    <div class="navbar-header">
                        <button type="button" id="nav-toggle" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navigation-menu">Toggle navigation</button> 
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                    </div>  <!-- End navbar-header -->
    
                    <!-- Navigation -->
    
                    <nav id="navigation-menu" class="collapse navbar-collapse"  role="navigation">
                      <ul class="nav navbar-nav navbar-right">
                     <li>hi</li>            
    
                      </ul>
                    </nav>  <!-- End navbar-collapse -->
    
                </div>  <!-- End container -->
                <br />
            </nav>  <!-- End navbar -->

    【讨论】:

    • 它仅适用于少数 nab tab 2 不起作用。
    • 如果您提供生成的html,我可以提供更好的答案
    猜你喜欢
    • 2017-03-19
    • 1970-01-01
    • 2021-08-06
    • 2015-04-09
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多