Schreiben Sie die textarea, wenn enter-Taste gedrückt wird?

Ich habe eine textarea, die Griff-Ausgang und ein textfield, die Behandlung von Benutzereingaben.

Fokus wird ausschließlich auf das Eingabefeld.
Ich kann nicht machen Sie es so, dass die Benutzer-Eingabe-Feld wird text hinzufügen, wenn das Formular abgeschickt wird (enter-Taste gedrückt wird). Es wird nur funktionieren, wenn eine Taste geklickt wird. Wie löse ich dieses Problem?

Unten ist der code, den ich versuche für Sie die enter-Taste Absenden.

<html>
<head>
<script type="text/javascript">
  function addtxt(input) {
    var obj=document.getElementById(input)
    var txt=document.createTextNode("blah blah")
    obj.appendChild(txt)
  }
</script>
</head>
<body>
<textarea id="textarea1"></textarea>
<br><input type="text" onSubmit="addtxt('textarea1');">
</body>
</html>

InformationsquelleAutor Big Mo Fo | 2010-09-09

2

Dies wird den job tun. Auch Sie sollten deal mit der value Eigenschaft der textarea-anstatt anfügen von text-Knoten, um es: wenn der Benutzer die textarea value bei allen, ändert es seine Kind-Knoten, dann wird keine Wirkung haben. Wenn Sie möchten, dass die textarea zu Lesen-nur, fügen Sie ein readonly Attribut: <textarea id="textarea1" readonly></textarea>.
```
<script type="text/javascript">
    function inputKeyDown(evt, input) {
        if (evt.keyCode == 13) {
            var textarea = document.getElementById("textarea1");
            textarea.value += "\n" + input.value;
            input.value = ""; //I'm guessing you may want this
            return false;
        }
    }
</script>

<input type="text" onkeydown="return inputKeyDown(event, this);">
```
- Ich ganz übersehen die Antwort, Tim, aber das ist GENAU die Art von Stiftung, die ich möchte. Nach Umschalten mit der anderen Antwort für ein paar Stunden, bemerkte ich schließlich nach und steckte es in. Sie sind ein javascript-Gott. Kann jemand empfehlen, jede gute tutorials? Ich habe ein wenig Kenntnisse in python und Kenntnisse von CSS und xHtml.
InformationsquelleAutor Tim Down
1

Anstelle von senden, verwenden Sie das keypress-Ereignis. Erkennen, wenn die EINGABETASTE gedrückt wird, kopieren Sie die Daten, und die Veranstaltung abzusagen (zu verhindern, dass Formular-übermittlung). Wenn Sie erlauben, das Formular zu senden, es wird einfach ersetzen Sie den vorhandenen Seite mit dem Ergebnis des Formular-post.

Ändern Sie Ihre aktuelle code:
```
<html> 
<head> 
<script type="text/javascript"> 
  function addtxt(e,ctl,input) {
    var key;
    if (window.event) {
       key = event.keyCode;
    } else {
       key = e.which;
    }
    if (key == 13) {
       var obj=document.getElementById(input);
       var txt=document.createTextNode("blah blah");
       obj.appendChild(txt);
       ctl.value = '';
       return false;
    }
    return true;
  } 
</script> 
</head> 
<body> 
<textarea id="textarea1"></textarea> 
<br><input type="text" onkeypress="return addtxt(event,this,'textarea1');"> 
</body> 
</html>
```
Beachten Sie, dass es viel bessere Möglichkeiten, das zu erreichen Ihr Ziel, aber da Sie nicht sagen, was das ist, das ist wirklich das beste, das ich tun kann. Auch ich würde auf jeden Fall auf die Verwendung eines Frameworks wie jQuery/Dojo/Prototype und fügen Sie den Handler unauffällig.
- Das klingt wie eine gute Methode... aber wie würde ich gehen, um es?
- Ich fügte hinzu, ein Beispiel.
- Danke, das ist gut! Im Grunde, was ich versuche zu erreichen, ist eine rudimentäre terminal-like-Ding. Ich möchte in der Lage sein, etwas zu geben in das Eingabefeld ein, drücken Sie die EINGABETASTE, haben Sie das Skript gelesen haben, starten Sie die Eingabe durch eine if-Anweisung und Ausgabe etwas abhängig davon, was eingegeben wurde.
- Dieser code jedoch nicht akzeptieren, jeder andere Tastendruck...
- Ich werde das beheben. Weiß nicht, was ich dachte. Es sollte true zurückgeben, es sei denn, es ist ein geben. Vermutlich ist das Eingabefeld sollte gelöscht werden als gut.
- Genial tvan, das ist wirklich cool. Hilft mir ein wenig lernen. Was bedeutet der ctl.value = " zu tun? Diese syntax wirklich erinnert mich eine Menge von actionscript...
- Einige Punkte: die Verwendung der keydown Ereignis bedeutet, dass Sie verwenden können, die keyCode Ereignis-Eigenschaft in allen Browsern. Auch return true ist redundant: die Rückkehr undefined (das ist, was passiert in der Abwesenheit von einem return - Anweisung) das tut, was Sie wollen. Schließlich finden Sie meine Antwort für die details, aber die Bearbeitung eines textarea-Wert sollte getan werden, über die value Eigenschaft.
- Haben y ' all wissen, wie ich diesen code ändern, um jede Anweisung eingefügt, die auf eine neue Zeile in der textarea? Und die große Frage, denke ich: wäre, wo würde ich das einfügen der if-Anweisung zum Lesen des user-input-und output-text in der textarea-basierend auf dem, was gelesen wird?
InformationsquelleAutor tvanfosson
0

Verwenden Sie das form-element
```
<form onsubmit="addtxt('textarea1')">
    <textarea id="textarea1"></textarea>
    <br><input type="text" />
</form>
```
- OK, das funktionierte. Jedoch, nachdem der text geschrieben, auf die textarea, die Seite wird sofort aktualisiert und der text verschwindet.
- Ah, dann Sie nicht wollen, zu senden an alle
InformationsquelleAutor BGerrissen

Können Sie JQuery verwenden

$('textarea#textarea1').keypress(function(e) {
    if (e.keyCode == 13) { //enter
       //do some stuff
    }
});

InformationsquelleAutor jcubic

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.