2016-12-27 28 views
1

私はブートストラップv3.3.7を使用しています。ブートストラップモーダルを作成しましたが、クロムとサファリではすべて正常に動作しますが、何らかの理由でモジラで動作しません。 mozillaでモーダルボタンを押すと何も起こりません。これは私のコードです:ブートストラップ3モーダルのモーダルが表示されない

<button type="button" class="btn btn-lg accountBtn"> 
    <a href="#modal1" data-toggle="modal">Account details</a> 
</button> 

<div class="modal fade" id="modal1" role="dialog" style="display: none;"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header text-center"> 
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
        <span aria-hidden="true">&times;</span> 
       </button> 
       <h2>Header h2</h2> 
       <h3>Header h3</h3> 
       <ul class="characteristicsList"> 
        Characteristics: 
        <li><img src="images/modal1.png" alt="">Property: </li> 
        <li><img src="images/modal2.png" alt="">Property: </li> 
        <li><img src="images/modal3.png" alt="">Property: </li> 
       </ul> 
       <button type="button" class="btn btn-lg buyBtn"> 
        <a href="myPaypalLink" target="_blank">Buy Now X$</a> 
       </button> 
      </div> 
     </div> 
    </div> 
</div> 

また、私は私のhtmlでのモーダルずにまた私のモーダルとで使用「」タグと私のボタン:

<button type="button" class="btn btn-lg buyBtn"> 
    <a href="myPaypalLink" target="_blank">Buy Now X$</a> 
</button> 

はMozillaで動作しません。

答えて

2

アンカータグabuttonタグの内側に配置するのは間違いです。アンカータグを使用するだけで、すべてうまく動作します。

<a href="#modal1" data-toggle="modal" type="button" class="btn btn-lg accountBtn"> 
    Account details 
</a> 
+0

私はなぜこれがmozillaの問題ですが、クロムでうまくいくのですか? – Zvezdas1989

+0

私はそれほど確信していませんが、各ブラウザが 'html'標準を実装する方法が異なると思います。したがって、いくつかは非常に厳密になりますが、他の人はできるだけコードを実装しようとします –

関連する問題