Codemirror kann nicht an den Editor eingeben

Question

Das Problem ist, dass Codemirror-Plugin nach der Initialisierung i nicht in den Editor eingeben können, wenn textatea in CSS als display:none; gesetzt ist, das sind die Schritte i folgen:

a) erstellen und anhängen TextArea- Element:

var txt = document.createElement('TEXTAREA'); 
document.body.appendChild(txt); 

b) Initialisierung Codemirror-Plugin:

var html_edit = CodeMirror.fromTextArea(txt, { 
    mode: 'htmlmixed' 
}); 

an diesem Punkt, wenn Textbereich in CSS unberührt ist i in dem Editor eingeben kann, jedoch ist i tun Dies ist:

Cursor blinkt im Editor, aber ich kann nicht in den Editor eingeben.

Ich setze Textarea auf display:none in CSS, weil vor dem Codemirror-Skripte heruntergeladen und initialisiert Benutzer für zweite Textfeld Element sehen kann, die nicht sehr gut aussieht. Jedoch erzeugt es das obengenannte Problem, vielleicht hat jemand mit der ähnlichen Situation gehandelt, wie man es löst?

Answer 1

CodeMirror konzentriert eine ausgeblendete Textfläche, um Benutzereingaben zu verarbeiten. Ihre Regel wird diesem Element entsprechen und es so einstellen, dass es keine anzeigt, was bedeutet, dass es nicht fokussiert werden kann und Sie somit Ihre CodeMirror-Instanz nicht fokussieren können.

Verwenden Sie einen spezifischeren CSS-Selektor, indem Sie z. B. eine Klasse zu Ihrem Textbereich hinzufügen, so dass Sie nur den von Ihnen erstellten Textbereich ausblenden.