2017-10-25 13 views
-1

これはコードなので、誰も私がボタンをクリックするとブートストラップアラートが表示されないので、ページに表示されません!ボタンのクリックでブートストラップアラートを表示

<!DOCTYPE html><html lang="en"><head><script type="text/javascript">$(document).ready(function(){ 
$('button').click(function(){ 
    $('.alert').show() 
}) });</script><title>Bootstrap Example</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

.alert {表示:なし;}

</div> 

    <div class="col-md-6"> 
      <div style="border: 1px solid black; height: 100px;"> 

      </div> 
      <div style="border: 1px solid black; height: 100px;"> 
      </div> 
     </div> 


     <div class="container"> 
    <button>Send Message</button> 
    <div class="alert alert-success alert-dismissable"> 
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button> 
     Success! message sent successfully. 
    </div> 

</div> 

+0

なぜあなたはあなたの質問全体を変更しましたか?あなたの前の質問とそれに対するすべての答えが他の人に無用になるこの方法では、しないでください。 –

+0

他の質問への回答が必要な場合は、新しいものを作成してください。だから、質問を編集してオリジナルのものに戻してください。 –

答えて

1

その本当にハード、あなたの実際のコードを提供いけない、しかし...ここで何かを達成するためのアイデアを行きますブートストラップのクラスを使用している画像に似ています:

<div class="container"> 
    <div class="row"> 
     <div class="col-md-5" style="border: 1px solid black; height: 600px;"> 
      content here --> 
     </div> 

     <div class="col-md-7"> 
      <div class="row"> 
       <div class="col-md-12" style="border: 1px solid black; height: 300px;"> 
        content here --> 
       </div> 
      </div> 
      <div class="row"> 

       <div class="col-md-12" style="border: 1px solid black; height: 300px;"> 
        content here --> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

ブートストラップファイルを指している環境でこのコードを試してください。そうしないと完全に間違ってしまうでしょう。

+0

神はあなたを祝福します。 –

関連する問題