Question

切换按钮仅在纯HTML中工作，而在Laravel刀片中不工作，我不知道为什么？当我单击切换按钮时，其aria扩展从false更改为true，但是当我再次单击切换按钮时，aria-expand不会更改。我检查了所有内容，似乎都没错。

这是我在刀片中的代码：

 <!-- File: ./resources/views/layouts/master.blade.php -->
    <!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="utf-8"> 
            <meta name="description" content="">
            <meta name="viewport" content="width=device-width, initial- 
    scale=1.0">
            <meta name="csrf-token" content="{{ csrf_token() }}">
            <script src="{{ asset('js/app.js') }}" defer></script>
            <title></title>
            <link rel="stylesheet"
 href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

               <!-- main css -->
               <link rel="stylesheet" href="{{asset('css/style.css')}}">
               <link rel="stylesheet" href="{asset('css/responsive.css')}}">
  </head>
    <body>
        <header class="header_area">
            <div class="main_menu" id="mainNav">
                <nav class="navbar navbar-expand-lg navbar-light ">
                    <div class="container">
                        <!-- Brand and toggle get grouped for better mobile display -->
                        <button class="navbar-toggler "  type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation" ">
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <!-- Collect the nav links, forms, and other content for toggling -->
                        <div class="collapse navbar-collapse offset" id="navbarSupportedContent">
                            <ul class="nav navbar-nav menu_nav ml-auto" >

                                <li class="nav-item active"><a class="nav-link" href="{{ url('/about') }}">درباره ما</a></li>
                                <li class="nav-item submenu dropdown">
                                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">محصولات</a>
                                    <ul class="dropdown-menu">
                                        <li class="nav-item"><a class="nav-link" href="{{url('/azmayeshgahi')}}">آزمایشگاهی</a></li>
                                        <li class="nav-item"><a class="nav-link" href="{{ url('/sanati') }}">صنعتی</a></li>
                                    </ul>
                                </li> 
                                <li class="nav-item"><a class="nav-link" href="{{ url('/contact-us') }}">ارتباط با ما</a></li>
                                <li class="nav-item"><a class="nav-link" href="{{ url('/blog') }}">اخبار</a></li>
                                <li class="nav-item"><a class="nav-link" href="{{ url('/') }}">خانه</a></li>
                            </ul>
                        </div> 
                    </div>
                </nav>
            </div>
        </header>

       <div style="direction:rtl;" id="app">
            @yield('content')
        </div>


        <!-- Optional JavaScript -->
        <!-- jQuery first, then Popper.js, then Bootstrap JS -->
                <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
        <script src="{{asset('js/popper.js')}}"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js"></script>




    </body>
</html>

Answer 1

我找到了答案，我只是删除了app.js，但我仍然不知道为什么会这样。我需要app.js

如何修复Bootstrap中的掉落黎明按钮

1 个答案: