2014-09-19 34 views
0

我已成功創建了dojo。 但我需要將此編輯器從div移到另一個。 但是這是造成此錯誤: 類型錯誤:frameElement._loadFunc不是一個函數Dojo編輯器在將div從div移動到另一個時效果不佳

基本上這就是我:

<script src="dojo/dojo.js" data-dojo-config="isDebug: true"></script> 
<a href="javascript:move_dojo_editor();">Move Editor </a>  
<div id=container1 style="display:none;" > 
    <div class="claro" style="margin:10px" > 
     <div id=dojo_editor_1 data-dojo-type="dijit.Editor" style="width:800px;min-height:100px;" data-dojo-props="extraPlugins:['foreColor','hiliteColor','fontName', 'fontSize', 'formatBlock','|','createLink','insertImage','fullscreen','viewsource','newpage','print','toggleDir','smiley',{name: 'insertTable'}, 
      {name: 'modifyTable'}, 
      {name: 'insertTableRowBefore'}, 
      {name: 'insertTableRowAfter'}, 
      {name: 'insertTableColumnBefore'}, 
      {name: 'insertTableColumnAfter'}, 
      {name: 'deleteTableRow'}, 
      {name: 'deleteTableColumn'}, 
      {name: 'colorTableCell'}, 
      {name: 'tableContextMenu'}]"> 
      Example here.. 
     </div> 
    </div> 
</div> 
<div id=container2></div> 

On javascript I have this: 


// Include the class 
dojo.require("dijit.Editor"); 
// Require a few extra plugins 
dojo.require("dijit._editor.plugins.TextColor"); 
dojo.require("dijit._editor.plugins.LinkDialog"); 
dojo.require("dijit._editor.plugins.FullScreen"); 
dojo.require("dijit._editor.plugins.ViewSource"); 
dojo.require("dijit._editor.plugins.NewPage"); 
dojo.require("dijit._editor.plugins.FontChoice"); 
dojo.require("dijit._editor.plugins.Print"); 
dojo.require("dijit._editor.plugins.ToggleDir"); 

//dojox 
dojo.require("dojox.editor.plugins.PrettyPrint"); 
dojo.require("dojox.editor.plugins.PageBreak"); 
dojo.require("dojox.editor.plugins.ShowBlockNodes"); 
dojo.require("dojox.editor.plugins.Preview"); 
dojo.require("dojox.editor.plugins.Save"); 
dojo.require("dojox.editor.plugins.ToolbarLineBreak"); 
dojo.require("dojox.editor.plugins.NormalizeIndentOutdent"); 
dojo.require("dojox.editor.plugins.Breadcrumb"); 
dojo.require("dojox.editor.plugins.FindReplace"); 
dojo.require("dojox.editor.plugins.PasteFromWord"); 
dojo.require("dojox.editor.plugins.InsertAnchor"); 
dojo.require("dojox.editor.plugins.CollapsibleToolbar"); 
dojo.require("dojox.editor.plugins.Blockquote"); 
dojo.require("dojox.editor.plugins.Smiley"); 
dojo.require("dojox.editor.plugins.UploadImage"); 
require([ 
     "dojo/parser", 
     "dojox/editor/plugins/TablePlugins", 
     "dojo/domReady!" 

], function(parser) { 
     parser.parse(); 
}); 

function move_dojo_editor() 
{ 
    var tmp = $("#container1").html(); 
    $("#container1").html(""); 
    $("#container2").html(tmp); // the editor is displaying, yet I can't click inside it or on any option it has. 

} 

回答

1

無法通過隱藏節點的innerHTML再「移動」 DOM轉儲到另一個節點。這將有效地銷燬舊的DOM,並創建新的DOM,缺少原始DOM所具有的任何事件連接或關聯,因此會導致錯誤。

要正確地移動DOM,您需要使用實際的DOM API,而不是innerHTML。這裏有一個粗略的例子(爲簡便起見,我將假設給分度class="claro"claroContainer的ID):

document.getElementById('container2').appendChild(
    document.getElementById('claroContainer') 
); 

無關的,你真的應該考慮使用現代化道場的做法,而不是過時的全局和裝載機的API從1.7之前的AMD和AMD。關於升級,請參閱http://dojotoolkit.org/documentation/tutorials/1.10/modern_dojo/

相關問題