TinyMCE彈出與jquery加載

Question

我想使用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。

Answer 1

問題是關閉模式後，頁面上仍然有#binder-form。您應該刪除模式關閉的#binder-form元素。

只是取消註釋該行是在點擊關閉事件註釋：

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

我傾向於避免依賴於元素ID屬性在使用AJAX頁面。擁有兩個具有相同ID的元素可能會導致各種難以捕捉的錯誤。堅持在jQuery中使用類選擇器。

[編輯] 嗯，不，你是對的，你在下次點擊時刪除.popup，並且一個異常導致它打破點擊處理程序，並按照鏈接full.html。

我想說，由於某種原因，微小的mce會拋出一個錯誤，嘗試將其包裝在try catch塊中以明確爲什麼。