Bootstrap 4 sụp đổ không hoạt động

Thu gọn chuyển đổi dữ liệu Bootstrap không hoạt động. Vấn đề là khi nhấp vào liên kết thứ hai thì liên kết đầu tiên không bị sập

**Fiddle**  

Thử nghiệm

ghi bàn. 3

câu trả lời được chấp nhận

Thử nó. Bây giờ nếu bạn nhấp vào liên kết thứ hai thì liên kết đầu tiên bị sập

   
      
      
      
   
   
   

      

         

            
            Company Information
            
            
         
         

            

               

                  

                     Company Name
                     
                  
                  

                     Business Unit / Division
                     
                  
               

            

         

      

      

         

            
            Employee Information
            
            
         
         

            

               

                  

                     Job title / role
                     
                  
               

               

                  

                     Hours of Work
                     
                  
                  

                     Performance Rating
                     
                  
               

            

            

               

                  Personnel (Staff) Number
                  
               
            

         

      

      

câu hỏi tương tự

ghi bàn. 1

sử dụng 'trong' thay vì 'hiển thị' trong mã bên dưới

ghi bàn. 2

nếu không thì

vui lòng xóa hiển thị lớp trong nội dung tab đầu tiên div

từ

đến

và nó sẽ hoạt động

Bài đăng nổi bật từ cùng một thẻ

Trong trường hợp này, sự phức tạp là Avada tải các tài nguyên Boostrap đã sửa đổi của chính nó, dẫn đến xung đột với các tệp Bootstrap gốc, được tải bởi Bộ công cụ

Nếu bạn tiếp tục tải các tệp Bootstrap của Bộ công cụ trong khi sử dụng Avada, đặc biệt là các tệp tập lệnh, mọi xung đột phát sinh sẽ cần được xử lý tùy theo từng trường hợp. Để khắc phục sự cố này với phần tử "thu gọn", tôi sẽ đề xuất các bước sau

1. Vui lòng chọn "Chủ đề hoặc plugin khác đang tải Bootstrap 4" từ cài đặt Bộ công cụ.
( Quản trị viên WP -> Bộ công cụ -> Cài đặt -> "Tải Bootstrap")

Điều này sẽ ngăn Toolset tải các tệp Bootstrap mặc định

2. Đối với các phần tử giao diện người dùng, chỉ tải phần CSS/kiểu từ Bootstrap 4 mặc định của Bộ công cụ sẽ giúp bạn tránh xung đột tập lệnh. Để thực hiện việc này, bạn có thể cập nhật khối đầu tiên trong "chức năng" của chủ đề đang hoạt động của mình. php" vào

function theme_enqueue_styles() {
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( 'avada-stylesheet' ) );
    wp_enqueue_style( 'toolset_bootstrap_4-css', get_site_url().'/wp-content/plugins/types/vendor/toolset/toolset-common/res/lib/bootstrap4/css/bootstrap.min.css?ver=4.3.1' );
    
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );

Do đó, chỉ CSS và không có tập lệnh nào được tải từ Bootstrap 4 mặc định của Bộ công cụ

3. Đối với trạng thái hoạt động và không hoạt động của các phần tử có thể thu gọn, Avada và Bootstrap 4 sử dụng các tên lớp khác nhau. Để khắc phục điều này, bạn có thể thêm mã CSS tùy chỉnh sau vào WP Admin -> Giao diện -> Tùy chỉnh -> CSS bổ sung

Với mã này

$('#Collapse').on('show.bs.collapse', function () {
    alert('testing');
})

* Hành vi dự kiến ​​* Sự kiện bootstrap sẽ được kích hoạt khi mở phần thu gọn

*Hành vi thực tế*Sự sụp đổ được mở nhưng sự kiện bootstrap không được kích hoạt

Đây có phải là một lỗi được biết đến?

Tôi đang học cách phát triển các trang web đáp ứng trong ASP. NET và Bootstrap và ở đây tôi đã cố gắng phát triển một thanh điều hướng cơ bản. Nhưng tôi không thể thu gọn nó vì 'chuyển đổi dữ liệu' và 'mục tiêu dữ liệu' không hoạt động. Xin hãy giúp tôi và cũng đưa ra gợi ý nếu có bất kỳ vấn đề nào khác trong mã của tôi

Đây là mã

<. LOẠI TÀI LIỆU html>

  <link href="~/lib/twitter-bootstrap/css/bootstrap.css" rel="stylesheet" />
  <script src="~/lib/jquery/jquery.js"></script>
  <script src="~/lib/twitter-bootstrap/js/bootstrap.js"></script>
 </environment>
 <environment exclude="Staging,Production">
     <!-- CSS only -->

integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor"crossorigin="anonymous"asp-fallback-test-class="se-only"asp-fallback-test-property="position"integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor"
crossorigin="anonymous"
asp-fallback-href="~/lib/twitter-bootstrap/css/bootstrap.min.css"
asp-fallback-test-class="se-only"
asp-fallback-test-property="position"
asp-fallback-test-value="absolute"
asp-suppress-fallback-integrity="true" >

 </environment>
   

 <title>@ViewBag.Title</title>

Bình luận

Hiển thị nhận xét 0

Bình luận

5. Cần 1600 ký tự còn lại ký tự

▼

• Hiển thị cho tất cả người dùng
• Hiển thị với người đăng gốc & Microsoft
• Người kiểm duyệt có thể xem
• Có thể xem bởi người kiểm duyệt và người đăng gốc
• Khả năng hiển thị nâng cao

tệp đính kèm. Có thể sử dụng tối đa 10 tệp đính kèm (bao gồm cả hình ảnh) với tối đa 3. 0 MiB mỗi cái và 30. tổng cộng 0 MiB

Tại sao thu gọn không hoạt động trong Bootstrap 5?

Làm cách nào để thu gọn trong Bootstrap?

Sự sụp đổ trong Bootstrap 4 là gì?

Tại sao sự sụp đổ không hoạt động trong góc?