2番目のショーでTinyMCEの問題。ヘルプ

Question

インラインエディタとしてtinyMCEを追加しました。次のプロブレムを持ってください：これは初めての仕事です。カスタムスタイルで表示されますが、正しく動作しますが、キャンセルをクリックしてもう一度編集を開始すると、空のエディタが表示されます。これはコードです： UPD：cm.Node - docuement.createElementとel.setAttribute、cm.getByAttr（ 'attr'、 'attr_val'、el）のラッパー - elからattrによってelemntを取得します。 REQ - AJAXのラッパー、cm.merge - array_mergeのようなPHPで

var EditBlock = function(){ 
    var my = this; 
    var o = cm.merge({ 
     'id' : '', 
     'act' : '', 
     'val' : '', 
     'nobr' : false, 
     'text' : false, 
     'onSaved' : function(){}, 
     'onSave' : function(){}, 
     'params' : {'iconsPath' : 'interface/common/images/stdc/nicEditorIcons.gif'} 
    }, arguments[0]); 
    var prefix = 'tinyMCE_' + Math.random() + '_'; 
    var node = cm.getEl(o.id); 
    var txtArea = cm.addClass(cm.Node('textarea', {'id' : prefix + o.id, 'style': ('width:' + node.offsetWidth + 'px')}), prefix + o.id); 
    var saveBtn = cm.Node('input', {'type':'button', 'value':'Save'}); 
    var cancelBtn = cm.Node('input', {'type':'button', 'value':'Cancel'}); 
    var container = cm.Node('div', txtArea, cm.Node('div', saveBtn, cancelBtn)); 

    var plainText = function(node){ 
     var str = ''; 
     var childs = node.childNodes;   
     for(var i = 0, ln = childs.length; i < ln; i++){ 
      if(childs[i].nodeType == 3) 
       str += childs[i].nodeValue; 
      else if(childs[i].childNodes.length) 
       str += plainText(childs[i]); 
     } 
     return str; 
    } 

    var init = function(){ 
     node.onclick = my.edit; 
     cancelBtn.onclick = my.close; 
     saveBtn.onclick = function(){ 
      my.save(); 
      my.close(); 
     } 
    } 

    my.save = function(){ 
     var tmp = cm.Node('div', tinyMCE.get(prefix + o.id).getContent()); 
     var content = o.text? plainText(tmp) : tmp.innerHTML; 
     o.onSave(content); 
     node.innerHTML = content; 
     req({ 
     'act' : o.act, 
     'data' : 'data[content]=' + escape(content) + (o.val? '&data[val]=' + o.val : ''), 'handler' : function(){o.onSaved(content)} 
     }); 
    } 
    my.close = function(){ 
     tinyMCE.init({ 
      'editor_deselector' : prefix + o.id 
     }); 
     container.parentNode.removeChild(container); 
     node.style.display = 'block'; 
    } 
    my.edit = function(){ 
     txtArea.value = node.innerHTML; 
     node.style.display = 'none'; 
     node.parentNode.insertBefore(container, node); 
     var styles = ''; 
     var styleRef = cm.getByAttr('rel', 'stylesheet'); 
     for(var i = 0, ln = styleRef.length; i < ln; i++){ 
      styles += (i > 0? ',' : '') + styleRef[i].href; 
     } 
     tinyMCE.init({ 
      'height' : '100%', 
      'content_css' : styles + ',/sdtc-new/nc/interface/common/css/mce-editor.css', 
      'mode' : "specific_textareas", 
      'editor_selector' : prefix + o.id 
     }); 

    } 
    init(); 
} 

使用このように：再び問題について

new EditBlock({'onSave' : function(content){ 
      page.content = content; 
      viewDepartment(page); 
     }, 'id':'depContent', 'act' : '/departments/setContent/', 'val' : page.id, 'params' : {buttonList : ['fontSize','bold','italic','underline','strikeThrough','html']}}); 

ので...。最初に編集を開始するとすべて正常に機能します。保存をクリックするとすべて正常に動作します（いくつかのバグが残っていますが、保存した後、再度クリックして編集を開始できます）。空の編集領域。私はコンソールに見て、私が再び編集を開始したときに取り消した後、私は新しい編集を作成するが、古いものは破壊しない - 隠れたものだけを見つける。

私はusetynyMCEを試してみました。hideやshow、setContentといったエディタクラスのメソッドを試してみましたが、いくつかの結果がありました。キャンセル後、私はegainを編集できましたが、編集エリアはスタイルやボタンなしでした。

助けてください。もしコードで嫌になるなら、私は答えて喜んでいる。おかげさまで

Answer 1

ここではhide()とshow()を使用しないでください。最初のidと同じidを持つtinymceエディターを再初期化できるようにするには、正しくタイマーをシャットダウンする必要があります。 edtorインスタンスの使用を停止する

：

tinymce.execCommand('mceRemoveControl',true,'editor_id'); 

使用に

tinymce.execCommand('mceAddControl',true,'editor_id'); 

Answer 2

を再初期化するには注意してください！ これらの変更されていることから、あなたは（新しいバージョン、4+私は思うのため）とのより良い運を持っていることがあります。

tinymce.execCommand('mceRemoveEditor',true,'editor_id'); 

tinymce.execCommand('mceAddEditor',true,'editor_id');