当textarea被修改时，如何获取div中的输出？ [英] How to get the output in a div when a textarea is modified?
本文介绍了当textarea被修改时，如何获取div中的输出？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我使用下面的方法看到textarea区域被修改时的输出，它工作正常。但我想使用Codemirror作为textarea，当我在codemirror textarea插入任何数据，那么输出应该出现div。
I have used the below method to see the output whena textarea area is modified, it works fine. But i would like to use the Codemirror as the textarea, when i insert any data in codemirror textarea then the output should appear the div .
<script type="text/javascript">
function updateDisplay() {
document.getElementById("code").innerHTML = document.getElementById("entry").value;
}
</script>
<textarea onkeyup="updateDisplay();" name="entry" id="entry" cols="1000" rows="500"></textarea>
<div name="code" id="code" ></div>
CodeMirror
CodeMirror
<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/xml/xml.js"></script>
<script src="http://codemirror.net/mode/javascript/javascript.js"></script>
<script src="http://codemirror.net/mode/css/css.js"></script>
<script src="http://codemirror.net/mode/htmlmixed/htmlmixed.js"></script>
<textarea id="code" name="code">
<html style="color: green">
<!-- this is a comment -->
<style type="text/css">
h1 {font-family: comic sans; color: #f0f;}
div {background: yellow !important;}
body {
max-width: 50em;
margin: 1em 2em 1em 5em;
}
</style>
</head>
<body>
<script>
function jsFunc(arg1, arg2) {
if (arg1 && arg2) document.body.innerHTML = "achoo";
}
</script>
</body>
</html>
</textarea></form>
<script>
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {mode: "text/html", tabMode: "indent"});
</script>
推荐答案
您需要将onChange传递给CodeMirror，请尝试以下代码：
You need to pass onChange to the CodeMirror, try this code :
<script>
var editor = CodeMirror.fromTextArea(document.getElementById("entry"), {
mode: "text/html",
lineNumbers: true,
onKeyEvent: function(editor) {
document.getElementById("code").innerHTML = editor.getValue();
}
});
</script>
演示： http://jsfiddle.net/ZbHGY/
这篇关于当textarea被修改时，如何获取div中的输出？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
