Javascript 如何编写html内容以使用JQuery打开新窗口

点击run按钮打开包含html、css和javascript代码编辑器数据的新窗口。css是在新窗口中传递的，但html数据不是，在html中使用可以在javascipt中传递的代码镜像

运行botton代码在这里

<div style="float:left; width:100%; height:93px;">
    <span class="containerTitle" style="top:65px;">
        <a href="javascript:;" class="button_example" id="result" style="color: white;">Result</a>
    </span>
</div>

nwin函数是

<script>
    function nWin() {
        var w = window.open();
        $(w.document.body).html("<style>" + $('#css').val() + "</style>"+ $('#html').val() );
    }
</script>

函数nWin（）{
var w=window.open（）；
$（w.document.body）.html（“+$（'#css'）.val（）+”+$（'#html'）.val（））；
}

html数据代码镜像是

<div class="codecontainer" id="htmlContainer" style="max-width:40%;">
    <span class="containerTitle">HTML</span>
    <textarea class="code" id="html" style="display: none;"></textarea>     
</div>

HTML

在编辑器变量中传递值

<script>
    var editor = CodeMirror.fromTextArea(document.getElementById("html"), {
        lineNumbers: true,
        mode: "text/html",
        matchBrackets: true
    });
</script>

var editor=CodeMirror.fromTextArea（document.getElementById（“html”）{
行号：对，
模式：“文本/html”，
对
});

---

如何在html窗口中的函数nwin中设置值编辑器

我认为在获取值之前，您需要

将

从代码编辑器保存到文本区域。在我的例子中它是有效的

将相同的代码放在代码段中以供参考，但

窗口.open

似乎被阻止：

$（“结果”）。单击（nWin）；
var cssEditor=CodeMirror.fromTextArea（document.getElementById（“css”）{
行号：对，
模式：“文本/css”，
对
});
var htmlEditor=codemirr.fromTextArea（document.getElementById（“html”）{
行号：对，
模式：“文本/html”，
对
});
函数nWin（）{
//将代码提交到textarea，以便使用value提取代码
cssEditor.save（）；
htmlEditor.save（）；
var w=window.open（）；
$（w.document.head）.append（“+$（'#css'）.val（）+”）；
$（w.document.body）.html（$（'#html'）.val（））；
}

正文{
字体系列：无衬线；
字体大小：14px；
}
.button_示例{
显示：内联块；
背景：#ccc；
边界半径：3px；
边框：1px实心#333；
颜色：#333；
填充：10px 20px；
文字装饰：无；
}
.button_示例：悬停{
背景：#aaa；
}
.codecontainer{
宽度：50%；
浮动：左；
}
.clearfix{
明确：两者皆有；
}
}

CSS
HTML

元素应该放在

中，而不是

@Barmar。这是不正确的，样式元素可以放在任何地方。但是是的，它们“应该”放在head元素中。@stijnbarnards@Barmar-Hmm？似乎我犯了一个错误对不起。如何使用javascript？？也像html和CSP请查看我链接的JSFIDLE或我回答中的代码片段。是的，我也可以使用javascript编辑器，比如html和css htmlJavascript如何在jquery中使用Javascript对不起，我不明白你在问什么

<script>
    var editor = CodeMirror.fromTextArea(document.getElementById("html"), {
        lineNumbers: true,
        mode: "text/html",
        matchBrackets: true
    });
</script>