Firepad文本编辑器 – 没有显示的文本区域

我正在按照这里的说明创建一个firepad编辑器。

我的代码是：

function init() { var firepadRef = getExampleRef(); var codeMirror = CodeMirror(document.getElementById('firepad-container'), { lineWrapping: true }); var firepad = Firepad.fromCodeMirror(firepadRef, codeMirror, { richTextToolbar: true, richTextShortcuts: true }); firepad.on('ready', function() { if (firepad.isHistoryEmpty()) { firepad.setHtml('Rich-text editing with Firepad!

Collaborative-editing made easy.\n'); } }); } function getExampleRef() { var ref = new Firebase('https://firepad.firebaseio-demo.com'); var hash = window.location.hash.replace(/#/g, ''); if (hash) { ref = ref.child(hash); } else { ref = ref.push(); window.location = window.location + '#' + ref.key(); // add it as a hash to the URL. } return ref; } init(); 

问题是我得到了选项按钮，如图所示。

但文本字段不会出现，即使我提到了正确的id 。 原件就是这样的。

我做错了什么。 有没有其他文本编辑器可供使用？

Answer 1

这是一个firebase pad的例子：

 function init() { //// Initialize Firebase. var firepadRef = getExampleRef(); // TODO: Replace above line with: // var firepadRef = new Firebase(''); //// Create CodeMirror (with lineWrapping on). var codeMirror = CodeMirror(document.getElementById('firepad-container'), { lineWrapping: true }); //// Create Firepad (with rich text toolbar and shortcuts enabled). var firepad = Firepad.fromCodeMirror(firepadRef, codeMirror, { richTextToolbar: true, richTextShortcuts: true }); //// Initialize contents. firepad.on('ready', function() { if (firepad.isHistoryEmpty()) { firepad.setHtml('Rich-text editing with Firepad!

Collaborative-editing made easy.\n'); } }); } // Helper to get hash from end of URL or generate a random one. function getExampleRef() { var ref = new Firebase('https://firepad.firebaseio-demo.com'); var hash = window.location.hash.replace(/#/g, ''); if (hash) { ref = ref.child(hash); } else { ref = ref.push(); // generate unique location. window.location = window.location + '#' + ref.key(); // add it as a hash to the URL. } return ref; } init(); 

 html { height: 100%; } body { margin: 0; height: 100%; position: relative; background-color:#c00000; } /* Height / width / positioning can be customized for your use case. For demo purposes, we make firepad fill the entire browser. */ #firepad-container { width: 100%; height: 100%; background-color:#c5c5c5; }