Question

我使用Bootstrap创建了两个模态，这些模式是使用带有Ajax请求数据的jQuery打开的。问题是这些模态在谷歌浏览器上正常运行，但不适用于Firefox。我该如何解决？

我的代码如下：

$(document).on("click", "#file_popup", function() {
  $.ajax({
    url: "fileshare.php",
    method: "post",
    dataType: 'text',
    success: function(data) {
      $("#tbl_content").html(data);
      jQuery.noConflict();
      $("#pp_filedownload").modal('show');
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="modal fade" id="pp_filedownload" role="dialog" hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content" style="">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <strong class="modal-title">File Download</strong>
      </div>
      <div class="modal-body" id='tbl_content'>
      </div>
    </div>
  </div>
</div>

Answer 1

我尝试了一个示例，它适用于所有浏览器。试试这个，可能会对你有所帮助

＆＃13;

//You can launch the modal with the code below this.

$(document).ready(function(){
    $("#submitButton").click(function(){
        $("#myModal").modal();
    });
});

＆＃13;

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


    <input type="submit" id="submitButton"/>

 <!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
          <p>Some text in the modal.</p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
      
    </div>
  </div>

＆＃13;

Bootstrap模式不适用于Firefox

1 个答案: