即使 ajax 请求 bootstrap 3 模态，Summernote 也未初始化

Question

当您第一次单击 "Open Summernote" link 时。 Ajax加载成功和 summernote 按预期初始化。
关闭模态框并点击"Open Summernote"link。什么都没发生。
关闭模态框并点击"Open Summernote"link。 Summernote 已按预期初始化。
关闭模态框并点击"Open Summernote"link。没有任何反应。

..... 会一直这样下去

我不知道是否收到 ajax 内容在加载内容之前会包含 summernote 编辑器。所以在 ajax success 函数中初始化 summernote 不是一个选项。

正文：

<body>
    <a href="modal.html" class="ajaxPopup">Open Summernote</a>
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">X</button>
                     <h4 class="modal-title">Modal title</h4>

                </div>
                <div class="modal-body">
                    <div class="te"></div>
                </div>
            </div>
        </div>
    </div>
<script type='text/javascript'>
var $myModal = null;
$(document).ready(function () {
    $myModal = $('#myModal');
    $('.ajaxPopup').on('click', function () {
        $.ajax({
            url: 'modal.html',
            type: 'GET',
            context: this,
            success: function (response) {
                $myModal.find('.modal-title').html("Summernote");
                $myModal.find('.modal-body').html(response);
                $myModal.modal({
                    show: true,
                    backdrop: true
                });
            }
        });
        return false;
    });
});
</script>
</body>

modal.html内容

<div id='commentBox'></div>
<script type='text/javascript'>
    $(function () {
        $('#commentBox').summernote();
    });
</script>

有什么建议吗？

Answer 1

在打开模态正文之前清空它可以解决此问题。

http://jsfiddle.net/gze70ov2/

var $myModal = null;
$(document).ready(function () {
    $myModal = $('#myModal');
    $('.ajaxPopup').on('click', function () {
        $myModal.find('.modal-body').html('');
        $.ajax({
            url: '/echo/html/',
            data: {
                html: "<div id='commentBox'></div>" + "<script type='text/javascript'>$(function () {$('#commentBox').summernote();});<\/script>"
            },
            type: 'POST',
            context: this,
            success: function (response) {
                $myModal.find('.modal-title').html("Summernote");
                $myModal.find('.modal-body').html(response);
                $myModal.modal({
                    show: true,
                    backdrop: true
                });
            }
        });
        return false;
    });

});

即使 ajax 请求 bootstrap 3 模态，Summernote 也未初始化

Summernote not initialized on even ajax requests for bootstrap 3 modal

ajax

jquery

twitter-bootstrap

summernote