TinyMCE在jquery加载的弹出窗口中

时间:2012-04-15 19:01:36

标签: jquery tinymce

我正在尝试使用jquery版本的最新小型mce - TinyMCE 3.5b3 jQuery package,用于我的textarea。我创建一个弹出窗口来加载表单,这就是问题 - 在第一次加载后,如果再次单击相同的加载弹出按钮,ajax load将会中断。

这是link,看看我的意思。

但是,我测试了另一个ajax load 没有弹出窗口,然后jquery ajax就可以了。

jquery的,

$('.button-popup').click(function(){

    var object = $(this);

    // Remove any previous popup first.
    $(".popup").remove();

    // Now prepend a fresh popup.
    $(document.body).prepend("<div id='popup-edit' class='popup'></div>");

    // Load the content into the popup.
    $('#popup-edit').load('full.html', {}, function(){

        $('#binder-form').prepend("<div class='close'><a href='#' class='button-close'> x close </a></div>");   

        $('#binder-form').css({
            padding:"20px", 
            backgroundColor:"#ffffff"
        });

        $('textarea.tinymce').get_tinymce();
        $('form *[title]').inputHints();
        $('.button-submit').submit_form();

        $('.close').click(function(){
            $('.popup').fadeOut('fast',function(){
                //$(this).remove();
            });
            return false;
        });

    });

    return false;
});

$('.button').click(function(){

    $('.content').load('full.html', function() {
        $('textarea.tinymce').get_tinymce();
        $('form *[title]').inputHints();
        $('.button-submit').submit_form();

    });

    return false;
});

$('textarea.tinymce').get_tinymce();的插件位于jsfiddle

1 个答案:

答案 0 :(得分:1)

问题是关闭模式后#binder-form仍在页面上。您应该删除模态关闭时的#binder-form元素。

只需取消注释在关闭点击事件中注释掉的那一行:

    $('.close').click(function(){
        $('.popup').fadeOut('fast',function(){
            $(this).remove(); // this will remove the popup element
        });
        return false;
    });

我倾向于避免在使用ajax的页面中依赖元素id属性。拥有两个具有相同id的元素,可能会导致各种难以捕获的错误。坚持在jQuery中使用类选择器。

[编辑] 嗯,不,你是对的,你在下次点击时删除.popup,一个例外导致它打破点击处理程序并点击full.html的链接。

我会说微小的mce由于某种原因抛出错误,尝试将其包装在try catch块中以查明原因。