Question

<html>

<head>
<title>Edit it</title>


<script type="text/javascript" src="scripts/base/jquery.min.js"></script>
<script type="text/javascript" src="scripts/base/library_live.js"></script>


<style>
canvas{
    border: 1px solid black;
}
</style>

</head>

<body>


<textarea id="123"> </textarea>


<script>
$("#123").keyup(function(){
   $("#user-code").html($(this).val());
   $("#user-code").text($(this).val()); // If you want html code to be escaped
});
</script>
<div id="user-code" style="display:none;">



</div>

<canvas 
width="400"
height="500"
class="codehs-editor-canvas"></canvas>

<script>
var g = new CodeHSGraphics({
    canvas: $('.codehs-editor-canvas')
});
// run test # here.
g.runCode($("#user-code").text());

</script>

</body>
</html>

好的，我希望用户输入文本区域，然后输入要在div用户代码中显示的代码。谢谢:)我尝试了很多东西，但我无法让它工作谢谢！更新从建议仍然没有工作我还应该指出div将使用自定义库显示应用程序或某种形式。当我将代码放在文本区域时，它仍然不会在画布上显示代码。

另一种方法是将文本区域保存为文本文档，然后在刷新页面后使用该文本doc作为div id。

Answer 1

<强> Live demo

为了使文本出现在div标签中。您应该删除style="display:none"并使用此jquery代码：

$("#123").keyup(function(){
   $("#user-code").html($(this).val());
   // $("#user-code").text($(this).val()); // If you want html code to be escaped
});

或者这个jquery将为你处理隐藏和显示：

$("#123").keyup(function(){
    if($(this).val() == ""){
       $('#user-code').css('display','none');
    }else{
       $('#user-code').css('display','block');
    }
   $("#user-code").html($(this).val());
   // $("#user-code").text($(this).val()); // If you want html code to be escaped
});

Answer 2

$("#user-code").css({"display" : "block"});
$("#123").keyup(function(){
   $("#user-code").html($(this).val());
   // $("#user-code").text($(this).val()); // If you want html         code to be escaped
});

从文本区域框中获取文本，并将其放入div中

2 个答案: