2012-05-14 118 views
1

在点击一个按钮时,我想显示一个模态窗口。Twitter Bootstrap模态窗口

这就是我所实施的。

<a class="btn addIdeaBtn" data-toggle="modal" href="#addIdea" >Launch Modal</a> 
<!-- Model Window 
    ================================================== --> 
<!-- Placed at the end of the document so the pages load faster --> 
<div class="modal hide fade in" id="addIdea"> 
    <div class="modal-header"> 
    <button class="close" data-dismiss="modal">×</button> 
    <h3>Add Idea</h3> 
    </div> 
    <div class="modal-body"> 
    <form action="" method="post"> 
     <textarea id="addIdeaPopUp" class="tinymce" name="" cols="" rows=""></textarea> 
    </form> 
    </div> 
    <div class="modal-footer"> <a href="home.html" class="btn">Close</a> <a href="home.html" class="btn btn-primary">Add Idea</a> </div> 
</div> 

当我点击出现的模态窗口,然后消失的按钮:P

http://mink7.com/projects/cmrc/idea_exchange.html

该按钮在屏幕的底部向左粘着作为页脚。

回答

3

尝试从模态中删除in类。 JS自动在hidein之间切换。由于您的按钮设置为切换模式,因此它会消失,因为它相信它是可见的。

含义:<div class="modal hide fade" id="addIdea">

0

我不完全确定它为什么没有看到更多的源代码发生......但: 将类“tinymce”添加到您的文本区域是导致窗口消失的原因。

与tinymce的东西必须与bootstrap冲突。

您可能需要手动初始化bootstraps模态窗口或小心tinymce如何初始化自身。

希望这足以让你走上正确的道路。

+1

这就是一个类。我们尚未将TunyMCE纳入该项目。 –