html - iframe 未在模式弹出窗口中加载

Question

我使用了一个单页 HTML 页面，其中有三个 div。当我单击其中一个 div 模式弹出窗口并加载 iframe src 时。我面临的问题是当我第一次单击 div 时 iframe 没有正确加载。但是在 chrome 中，如果我右键单击然后输入重新加载框架，我的 iframe 会正确加载。谁能说我面临的问题是什么？为什么 iframe 第一次没有正确加载。我对这个问题一无所知。谁能帮助我。

我的 html 代码：发布一个 div 及其对应的模态弹出代码

分区代码：

<div class="bots" data-toggle="modal" data-target="#myartModal">
           <font class ="botHeading" ><b> Password Related</b></font><br /> 
              <font class = "botsub">Click here to Change,reset,enroll or unlock your account.</font>
        </div>

模态弹出窗口

  <div class="container">
      <!--<h2>Basic Modal Example</h2>
       Trigger the modal with a button 
      <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>-->

      <!-- Modal -->
      <div class="modal fade" id="myartModal" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg customModalHeight" role="document">

          <!-- Modal content-->
          <div class="modal-content">
            <div class="modal-header customModalHeader">
              <button type="button" class="close" data-dismiss="modal">&times;</button>
              <h3 class="modal-title" ><b>Account Recovery Agent</b></h3>
            </div>
            <div class="embed-responsive embed-responsive-4by3 z-depth-1-half customIframeHeight">
             <iframe class = "embed-responsive-item" src="http:/xx.xx.xx.xx:4001/"  allowfullscreen></iframe>
            <!--  <iframe class = "embed-responsive-item" src="http://xx.xx.xx.xx:4001/"  allowfullscreen></iframe> -->
            </div>

          </div>

        </div>
      </div>

    </div>

标签： htmliframebootstrap-modal