Twitter引导模式弹出窗口显示约一秒，然后消失

Question

我在注册页面上使用TB 2.0。我已在注册页面的底部添加链接，让用户参阅我们的条款等

这是我使用的标记的一个片段：

<div class="container"> 
    <!-- First 2 rows are modal elements --> 
    <div class="row"> 
     <div class="span12"> 
      <div id="userAgreement" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="userAgreementLabel" aria-hidden="true"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
        <h4 id="userAgreementLabel">User Agreement</h4> 
       </div> 
       <div class="modal-body"> 
        <p><?php echo file_get_contents(url_for('@legal',true)); ?></p> 
       </div> 
       <div class="modal-footer"> 
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
       </div> 
      </div> 
     </div> 
    </div> 

    <div class="row"> 
     <div class="span12"> 
      <div id="privacyPolicy" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="privacyPolicyLabel" aria-hidden="true"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
        <h4 id="privacyPolicyLabel">Privacy Policy</h4> 
       </div> 
       <div class="modal-body"> 
        <p><?php echo file_get_contents(url_for('@privacy', true)); ?></p> 
       </div> 
       <div class="modal-footer"> 
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
       </div> 
      </div> 
     </div> 
    </div> 

    <h3 align="center">Sign up to Foobar</h3> 
    <br /> 

    <div class="row"> 
     <div class="span5 offset1 gray-1px-rh-border"> 

      <form class="form-horizontal" action="#" method="post"> 
       <div class="control-group"> 
        <label class="control-label" for="inputEmail">Email</label> 
        <div class="controls"> 
         <input type="text" id="inputEmail" placeholder="Email"> 
        </div> 
       </div> 
       <div class="control-group"> 
        <label class="control-label" for="inputUsername">Username</label> 
        <div class="controls"> 
         <input type="text" id="inputUsername" placeholder="Username"> 
        </div> 
       </div> 
       <div class="control-group"> 
        <label class="control-label" for="inputPassword">Password</label> 
        <div class="controls"> 
         <input type="password" id="inputPassword" placeholder="Password"> 
        </div> 
       </div> 
       <div class="control-group"> 
        <label class="control-label" for="inputConfirmPassword">Confirm Password</label> 
        <div class="controls"> 
         <input type="password" id="inputConfirmPassword" placeholder="ConfirmPassword"> 
        </div> 
       </div> 
       <div class="control-group"> 
        <div class="controls"> 
         <label class="checkbox"> 
          <input type="checkbox" id="chk-agree">Agree Terms* 
         </label> 
         <button type="submit" class="btn btn-success" id="signup-button">Get Access</button> 
        </div> 
       </div> 
      </form> 

     </div> 

     <div class="span4"> 
      <div class="container shift-right"> 
      </div> 
     </div> 
    </div> 

    <br /> 

    <div class="row"> 
     <div class="span10 offset1"> 
      <div class="sign-up-agreement"> 
       <small>*By signing up, you are indicating that you have read, understood and agree to our 
        <a id="lpl1" href="#userAgreement" data-toggle="modal">user agreement</a> and 
        <a id="lpl2" href="#privacyPolicy" data-toggle="modal">privacy policy</a>. 
       </small> 
      </div> 
     </div>  
    </div> 

</div> 

弹出的对话框暂时显示（大约一秒钟），在它消失之前，它似乎从底部滚动到顶部（我必须这样做几次，因为它发生得很快）。对话框显示为从下往上滚动，我看到的最后一件事是带有标题的对话框标题，然后消失，页面仍然变暗 - 直到我点击屏幕。

[编辑]

后使用Firebug进一步调查，我已经缩小的问题是什么做的JavaScript。我注意到应用于元素的＃display＃style属性（很简单），设置为block，然后很快（出于某种未知的原因），＃display＃属性设置为none - 这会导致对话框消失。

我手动设置显示属性block在萤幕控制台，弹出对话框出现，并表现正常。所以问题是这样的：是什么导致display属性在大约1秒后重置为'none'？

[[编辑2]]

当我更换file_get_content()函数调用与简单的文本，如“世界你好”和“你好2”的两个弹出窗口，它们按预期方式工作（即，正确地）。所以这肯定是与在get_file_content()函数中返回的HTML文本有关的。

任何帮助表示赞赏。

Answer 1

最后，我解决了这个问题，将file_get_contents()检索的内容放入iframe。不知道这是否有更好的方法，但这是我发现的唯一工作。

Answer 2

有时候，这是由多次包含jQuery引起的，请确保不是这种情况。

此外，您可以手动更改模式的位置以确保它在屏幕上启动。你只需要改变利润率。看看我的教程：change twitter bootstrap position我希望这有助于。