I am trying to built code player that shows result of html page including script in iframe. but something seems to be wrong here. it seems javascript not working every time i click button i see error in console.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="codemirror/lib/codemirror.css">
<link rel="stylesheet" href="codemirror/theme/solarized.css">
<script src="codemirror/lib/codemirror.js"></script>
<script src="codemirror/mode/xml/xml.js"></script>
<script src="codemirror/mode/htmlmixed/htmlmixed.js"></script>
</head> <style> .CodeMirror{border:1px solid black} </style>
<body>
<form>
<div id="editorContainer" style="width:50%">
<textarea id="code" name="code" class="CodeMirror">
<button id="btn" onclick="say()">hello</button>
<script>
function say(){
alert('test')
}
</script>
</textarea>
</div>
</form>
<button>click</button>
<iframe id="frame"></iframe>
<script type="text/javascript">
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
mode: "text/html",
lineNumbers: true
});
$("button").click(function(){
var code= editor.getValue();
$("iframe").contents().find("html").html(code);
})
</script>
</body>
</html
>
