附加CKEditor在div标签使用onclick事件?



我正在创建一个博客网站,我想添加这个(CKEditor)或任何文本编辑器(所见即所得)到我的表单标签。我在所有知名的平台上搜索了很多。但我没有找到答案。我使用的方法是我自己写脚本。当我单击时,我在脚本的引号中键入textarea标签代码,但简单的textarea标签被添加到我的代码中。但是编辑器脚本没有加载。如何在单击事件上加载全功能编辑器?

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CKEditor</title>
<script src="https://cdn.ckeditor.com/4.16.2/standard/ckeditor.js"></script>
</head>
<body>
<h3>Document Load (Working)</h3>
<textarea name="editor1"></textarea>
<script>
CKEDITOR.replace( 'editor1' );
</script>            
<h3>When Append (not working)</h3>
<button onclick="addCodeEditor('Editor')" class="btn btn-primary">Editor</button>   
<div id="additionalElement"></div>
<script>
CKEDITOR.replace( 'editor2' );
</script>
</body>
</html>
<script>
var codeEditorCount;
function addCodeEditor(Editor){
var div = document.getElementById('additionalElement');
div.innerHTML += '<textarea name="editor2"></textarea>';
codeEditorCount++;
}
</script>

可以。我为你做了一把小提琴:https://jsfiddle.net/bogatyr77/cbuzmfpL/2/
我不知道为什么在代码示例中显示错误,但是小提琴工作。

document.getElementById('editor1').style.display = 'none';
function myFunction() {
CKEDITOR.replace('editor1');
}
<script src="https://cdn.ckeditor.com/4.16.2/standard/ckeditor.js"></script>
<button type="text" onClick="myFunction()">
Click me
</button>
<textarea name="editor1" id="editor1" rows="10" cols="80">
This is my textarea to be replaced with CKEditor 4.
</textarea>

最新更新