首页 > 解决方案 > 如何在 javascript 中将文本框设置为 eval()

问题描述

好的,所以我正在尝试进行测验,您可以在其中输入一些代码,然后测验会执行代码以查看您输入的内容是否与答案相同。

这是代码,这就是网页的样子:

questions = "PRINT HELLO"
document.getElementById("Question").innerHTML = questions
function check(){
  document.getElementById("answertext").innerHTML = eval(document.getElementById("answerbox").value)
 
}
#answerbox{
  width:100%;
  height:500px;
  font-size:25px;
}
<h1>QUIZZZ</h1>

<h2 id = Question>JAVASCRIPT CONSOLE AND EXERCISES</h1>

<h1 id = "hi"></h1>

<textarea rows="4" cols="50" id = "answerbox">
//put your answer here
</textarea>
<textarea rows= '4' cols = "50" id = "answertext">lol</h1>
</textarea>
<input type = "submit" onclick = "check()">

运行代码以查看我希望用户在文本框中输入 document.write() 语句,并将评估的代码显示在较小的多行文本框中。

尝试在文本框中放置一个 document.write() 语句并运行它。您应该会看到一个新页面,而不是文本框中的答案。

我知道 document.write 在 javascript 中输出内容是一种不好的做法,而且我知道您可以编辑原始 HTML,但是有没有其他方法可以让用户在不做任何这些选择的情况下打印消息?

标签: javascripthtmleval

解决方案


不要使用评估。

使用 eval 被认为是一种不好的做法。阅读更多关于为什么在这里。您可以要求您的用户只使用return如下所示的语句返回答案,而不是要求他们做一些复杂的事情,例如document.write().

// Ask them to do this:
var codeFromTheAnswerBox = "var answer = 'HELLO'; return answer;"
// instead of this:
// var codeFromTheAnswerBox = "var answer = 'HELLO'; document.write(answer)";

// execute user's code
var code = new Function(codeFromTheAnswerBox);
var returnValue = code();

// Now do whatever you want to do with the answer like the following
alert("Your answer is " + returnValue);

推荐阅读