Wie kann ich an JavaScript-Konsole in Browser-Code von Benutzer in TextArea

senden Ich möchte eine Webseite für Benutzer zu erstellen, um Code-Übungen zu üben. in Javascript. und ich suche nach einer Möglichkeit, den Code in der Browsersitzung auszuführen und den Benutzer anzuzeigen, wenn es irgendwelche Fehler gibt. Ich habe mich gefragt, ob es funktioniert, wenn ich den Benutzertext aus der Textarea entpacke und ihn als Teil einer Funktion ausführe. Hier ist, was ich habe, aber ich habe nicht senden konnte den Benutzer eingegebenen Text zu trösten .. Jede Hilfe dankWie kann ich an JavaScript-Konsole in Browser-Code von Benutzer in TextArea

<!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>

Quelle

2017-06-17 miatech

Verwenden 'eval()', um den Code auszuführen. – Barmar

Was passiert, ist, dass das Formular abgeschickt wird, und es macht die Seite zu aktualisieren und das ist warum Sie die console.log nicht sehen können. Sie können return false die Formularübermittlung verhindern oder die form überhaupt entfernen.

<!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>

OHNE FORM (UND 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>

Quelle

2017-06-17 00:43:28 luisenrike

Ein Vorschlag, den ich machen würde, ist in Ihrem "ohne Formular" Beispiel, verwenden Sie überhaupt keine Absenden-Schaltfläche. Um es semantischer zu gestalten, verwenden Sie das HTML-Element der Schaltfläche (oder den Eingabetyp = "button", wenn Sie Unterstützung für IE <10 benötigen). –

Ich habe es geändert, danke – luisenrike

vielen Dank ... aber warum versuche ich Ihr Beispiel auf meiner Seite und ich bekomme nicht den Code zu laufen? .. Wenn ich 1 + 1 eingeben, bekomme ich 2 auf console.log Das ist eine große Verbesserung. Eine andere Frage ist: Warum gibt es mir keine Fehler, wenn Semikolon am Ende einer Anweisung weggelassen wird. Das wäre großartig, da es mir eine sintax-Fehlerüberprüfung liefert ... danke dir – miatech

Wie kann ich an JavaScript-Konsole in Browser-Code von Benutzer in TextArea

Antwort

Verwandte Themen