javascript - 在 Twitter Bootstrap Modal 中显示 DIV 元素以及 DOM

Question

我有一个简单的 div 标记，其中包含一个按钮。当用户单击此按钮时，它只会显示一条警报。

<div id="myDiv">
    <input type="button" id="btn" value="Click Me" />
</div>

我还有一个空的 Twitter Bootstrap 模式。

<div class="modal hide" id="myModal">
    <div class="modal-header">
        <button class="close" data-dismiss="modal">×</button>
         <h3>Modal header</h3>

    </div>
    <div class="modal-body"></div>
</div>

我有第二个按钮，当用户单击它时，它会打开 Bootstrap 模式。当用户单击第二个按钮时，我想在 Bootstrap 模式中显示“myDiv”。我希望“myDiv”在模态打开时出现，并且我也希望出现在我的 HTML 文档中。这样我就可以随时访问它，而无需在模式中创建第二个按钮。

知道我该怎么做吗？

Answer 1

我认为这就是您想要的，所以基本上在模态显示上我们将该按钮附加到模态主体。

$("#myDiv") .appendTo(".modal-body");

但是我们还没有完成，因为在模态关闭后我们需要将它放回正文中，所以我们这样做:

 $('#myModal').on('hide.bs.modal', function (e) {
$("#myDiv") .prependTo("body");     
})

这里是一个工作 fiddle :

http://jsfiddle.net/zcb3h/2/

我希望这就是您正在寻找的内容。