2012-11-22 28 views
15

Tôi đang sử dụng Google Chrome.
Sử dụng Twitter Bootstrap, tôi muốn thêm cảnh báo đơn giản, rất tiếc là alert không loại bỏ khi nhấn x!Cảnh báo sa thải bằng cách sử dụng Twitter Bootstrap không hoạt động?

Dưới đây là mã của tôi dựa trên alert tài liệu:

<!DOCTYPE html> 
<html> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script> 
    <!-- Bootstrap --> 
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen"> 
    </head> 
    <body>  
    <div class="alert"> 
     <button type="button" class="close" data-dismiss="alert">×</button> 
     <strong>Warning!</strong> Best check yo self, you're not looking too good. 
    </div>  
    </body> 
</html> 

Và tôi cũng đã cố gắng:

<!DOCTYPE html> 
    <html> 
    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script> 
     <!-- Bootstrap --> 
     <link href="css/bootstrap.min.css" rel="stylesheet" media="screen"> 
    </head> 
    <body>  
    <div class="alert"> 
     <a href="#" class="close" data-dismiss="alert">×</a> 
     <strong>Warning!</strong> Best check yo self, you're not looking too good. 
    </div>  
    </body> 
    </html> 

gì là mất tích để làm cho nó sa thải?

+8

Không lạ, vì bạn đã hoàn toàn quên bootstrap.js :) – davidkonrad

+2

Nó hoạt động :) .... Cảm ơn :) .... Bạn có thể đặt nó làm câu trả lời để tôi có thể tăng điểm của bạn :) –

+3

, chỉ là một sai lầm điển hình - happends tất cả các thời gian :) – davidkonrad

Trả lời

19

Nhờ nhận xét của davidkonrad.
Giải pháp là tầm thường, bằng cách thêm:

<script src="js/bootstrap.min.js"></script> 
+2

Một nguyên nhân có thể là: Uncaught Lỗi: JavaScript của Bootstrap yêu cầu jQuery. Sau đó, hãy thêm '% script {: src => '//code.jquery.com/jquery.js'}' –

0

Tôi đã viết một small, customisable, jquery plugin rằng tiêm một hình thành đúng Bootstrap 3 alert (có hoặc không có nút đóng khi bạn cần nó) với tối thiểu là phiền phức và cho phép bạn để dễ dàng tái tạo nó sau khi hộp được đóng lại.

Xem https://github.com/davesag/jquery-bs3Alert để biết cách sử dụng, kiểm tra và ví dụ.

Các vấn đề liên quan