2017-06-17 16 views
1

私はユーザがコード演習を練習できるようにウェブページを作りたいと思います。 JavaScriptで。私はブラウザセッションでコードを実行し、エラーがあればユーザーを表示する方法を探しています。私はtextareaからユーザテキストを取得し、それが関数の一部として実行されることでうまくいくのだろうかと思っていました。ここで任意の助けのおかげjavascriptコンソールにどのようにブラウザコードを入力すればいいですか?

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="UTF-8"> 
    <title>JScript Page</title> 
    <script> 
     function jstest() { 
     var text = document.getElementById("textArea").value; 
     console.log(text); 
     } 
    </script> 
    </head> 
    <body> 
    <h2>Enter your code here!</h2> 
    <form > 
    <textarea rows="4" cols="50" id="textArea"> 
</textarea><br> 
    <input type="submit" value="Submit" onclick="jstest()"> 
</form> 
    </body> 
</html> 
+3

使用 'のeval()'のコードを実行します。 – Barmar

答えて

4

は何が起こることはフォームが送信されると、それはページをリフレッシュすることができ、それがあるということです。私が得たものだが、私は、ユーザーがテキストを入力し、コンソールに送信することができていませんなぜconsole.logが見えないのですか?フォームの提出を防ぐには、return falseを入力するか、formを削除してください。 FORM WITHOUT

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>JScript Page</title> 
 
    <script> 
 
    function jstest() { 
 
     var text = document.getElementById("textArea").value; 
 
     console.log(text); 
 
     return false; 
 
    } 
 
    </script> 
 
</head> 
 

 
<body> 
 
    <h2>Enter your code here!</h2> 
 
    <form> 
 
    <textarea rows="4" cols="50" id="textArea"> 
 
</textarea><br> 
 
    <input type="submit" value="Submit" onclick="return jstest();"> 
 
    </form> 
 
</body> 
 

 
</html>
(AND EVAL)

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>JScript Page</title> 
 
    <script> 
 
    function jstest() { 
 
     var text = document.getElementById("textArea").value; 
 
     try { 
 
     eval(text); 
 
     } catch (e) { 
 
     if (e instanceof SyntaxError) { 
 
      alert(e.message); 
 
     } 
 
     } 
 
    } 
 
    </script> 
 
</head> 
 

 
<body> 
 
    <h2>Enter your code here!</h2> 
 
    <textarea rows="4" cols="50" id="textArea">alert('some')</textarea><br> 
 
    <input type="button" value="Submit" onclick="jstest();"> 
 
</body> 
 

 
</html>

+1

「フォームなし」の例では、送信ボタンを一切使用しないでください。より意味的にするには、ボタンのHTML要素(またはIE <10のサポートが必要な場合は入力タイプ= "ボタン")を使用します。 –

+1

私はそれを変更しました。ありがとう – luisenrike

+0

ありがとうございます...しかし私は私のページであなたの例を試して、私は実行するコードを取得しないのですか?.. 1 + 1を入力した場合、私はconsole.logこれは大きな改善です。もう一つの質問は、なぜステートメントの終わりにセミコロンを省略してもエラーにならないということです。それはsintaxエラーチェックを私に提供するのでそれは素晴らしいだろう...ありがとう – miatech

関連する問題