jQueryのポップアップのTinyMCE

Question

私のテキストエリアに最新の小さなmce-TinyMCE 3.5b3 jQuery packageのjqueryバージョンを使用しようとしています。私はフォームをロードするポップアップを作成し、ここに問題があります - 最初にがロードされた後、同じロードポップアップボタンを再度クリックすると、ajax loadが壊れます。

ここにはlinkの意味があります。

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; 
    }); 

私は、Ajaxを使用しているページ内の要素のid属性に頼る避ける傾向にあります。同じidを持つ2つの要素を持つと、すべての種類のバグを見つけにくくなる可能性があります。これにjQueryでクラスセレクタを使うことにこだわりましょう。

[EDIT] うーん、ないあなたは正しい、あなたが次のクリックで.popupを削除していて、例外がクリックハンドラを破り、full.htmlへのリンクをたどるすることになります。

私は小さなmceが何らかの理由でエラーを投げたと言いたいのですが、それをtry catchブロックでラップして正確な理由を調べてみてください。