2012-11-22 13 views
15

Google Chromeを使用しています。
Twitter Bootstrapを使用すると、簡単なアラートを追加したいと思いますが、残念ながらalertはxを押すと解除されません。Twitter Bootstrapを使用してアラートを閉じても機能しませんか?

はここalert文書に基づいて私のコードです:

<!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> 

そして、私も試してみました:

<!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> 

をそれを却下するために欠けていますか?

+8

bootstrap.jsを完全に忘れてしまったので、奇妙なことはありません:) – davidkonrad

+2

これはうまくいきます...ありがとうございました:) ...あなたの答えを増やすことができます:) –

+3

心配しないでくださいちょうど典型的な失敗 - 常に起こっています:) – davidkonrad

答えて

19

davidkonradさんのコメントありがとうございます。

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

もう一つの原因が考えられます:Uncaught Error:BootstrapのJavaScriptにはjQueryが必要です。それから '%script {:src => '//code.jquery.com/jquery.js'}' –

0

私は(あなたがそれを必要としてか、[閉じる]ボタンなし)大騒ぎの最小と適切に形成され、ブートストラップ3アラートを注入し、ことができますsmall, customisable, jquery pluginを書いた:
ソリューションを追加することにより、簡単ですボックスが閉じられた後で簡単に再生することができます。

使用法、テスト、および例については、https://github.com/davesag/jquery-bs3Alertを参照してください。

関連する問題