![](/img/trans.png)
[英]How to trigger onchange event in an IFrame mithril element when a codemirror editor in the srcdoc of the IFrame changes?
[英]How to load codemirror js editor into an iframe?
我想将Codemirror js编辑器加载到iframe中,以避免样式覆盖。 我阅读了文档https://codemirror.net/doc/manual.html#config,但不清楚。 这是我尝试过的。
的HTML
<iframe id="code"></iframe>
s
var codemirror = CodeMirror(document.getElementById("code").contentWindow.document.body, {
mode: "javascript",
theme: "monokai"
});
如何将Codemirror js编辑器加载到iframe中?
将以下代码放在html标记中。
<iframe src="https://codemirror.net/doc/manual.html#config"></iframe>
如果要在iframe中安装CodeMirror,则需要两个不同的html文件。 请参阅下面的一个非常简单的示例。 请进一步说明更多要求。
iframe.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel=stylesheet href="http://codemirror.net/doc/docs.css">
<link rel=stylesheet href="http://codemirror.net/lib/codemirror.css">
<script src=http://codemirror.net/lib/codemirror.js></script>
<script src=http://codemirror.net/mode/htmlmixed/htmlmixed.js></script>
<style type=text/css>
.CodeMirror {float: left; width: 100%; height: 100%; }
</style>
</head>
<body>
<div>
<textarea id=content name="content"></textarea>
</div>
<script>
var editor = CodeMirror.fromTextArea(document.getElementById('content'), {
mode: 'application/x-httpd-php',
lineNumbers: true
});
</script>
</body>
</html>
main.html
<!DOCTYPE html>
<html>
<body>
<iframe src="iframe.html"></iframe>
</body>
</html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.