Versucht, Benutzereingaben aus einem Textfeld zu lesen und sie in Javascript auszudrucken?

Wenn ich dies ausführen die "Sie eingegeben: einfügen Text hier" erscheint für eine Sekunde und verschwindet dann und das Textfeld löscht sich von selbst. Ich verbrachte 3 Stunden und ich kann nicht sehen, wo ich meinen Fehler mache. Jede Hilfe wird geschätzt! Vielen Dank.Versucht, Benutzereingaben aus einem Textfeld zu lesen und sie in Javascript auszudrucken?

<!DOCTYPE html> 
<html> 

<head> 
<title> Basic JavaScript </title> 

<script type = "text/javascript"> 
function Copier() { 

var firstWord= document.getElementById("Word1").value; 
document.write("You entered: " + firstWord); 

} 

</script> 

</head> 
<body> 


<form> 

Word Number 1: 
<input type = "text" id = "Word1" > 
<br> 

<button onclick = "Copier()">Copy Text Box 1</button> 

</form> 

</body> 

</html>

Quelle

2016-06-12 Luxpride

Sie nicht das Formular-Tag benötigen.

Falls Sie ein Formular-Tag um Ihre Eingabe verwendet wird, nimmt der Browser, dass es ein Verfahren, wie definiert sein:

<form action="post/get" url="some-file.php">

Sobald Ihr JavaScript, um die Eingabe packte hat, kapiert die ausgespült durch die Form (re) action, die auf keine Datei verweist.

Lassen Sie einfach das Formular-Tag und greifen Sie den Wert durch das Eingabefeld selbst.

<!DOCTYPE html> 
<html> 
<head> 
<title> Basic JavaScript </title> 
<style> 
input[type="text"] { 
    border: 1px solid #565656; 
    padding: 2px; 
    color: black; 
} 
#display { 
    position: relative; 
    top: 0; 
    width: 300px; 
    height: 30px; 
} 
</style> 
<script type = "text/javascript"> 
function Copier() { 
var firstWord= document.getElementById("Word1").value; 
var box = document.getElementById('display'); 
box.innerHTML = "You entered:" + firstWord; 
} 
</script> 
</head> 
<body> 
Word Number 1: 
<input type="text" id="Word1" > 
<br> 
<button onclick = "Copier()">Copy Text Box 1</button> 
<div id="display"></div> 
</body> 
</html>

Quelle

2016-06-12 20:03:13

Danke, das Formular-Tag mich abzuwerfen! – Luxpride

Gern geschehen. –

Verwenden Sie nicht document.write(), da es gefährlich ist. Erstellen Sie ein separates Element mit einem eigenen id und verwenden innerHTML:

function Copier() { 
 
    document.getElementById("output").innerHTML = "You entered: " + document.getElementById("Word1").value; 
 
}

<form> 
 

 
    Word Number 1: 
 
    <input type = "text" id = "Word1" > 
 
    <br> 
 

 
    <button onclick = "Copier()">Copy Text Box 1</button> 
 
    <p id="output"></p> 
 
</form>

Quelle

2016-06-12 19:53:38

Verwendung des Benutzers 'user2521387' über das Formular-Tag. Sie sollten das Formular-Tag fallen, und wenn Sie innerHTML- nicht verwenden möchten, können Sie etwas tun:

function Copier() { 
    var firstWord = document.getElementById("Word1").value; 
    var box = document.getElementById('display'); 

    //clear all childs of div with id 'display' 
    while (box.firstChild) { // whilte first child is valid 
     box.removeChild(box.firstChild); // removes first child 
    } 
    var p = document.createElement("p"); //create p tag 
    p.appendChild(document.createTextNode("You entered:" + firstWord)); 

    box.appendChild(p); //add p tag to div 

}

Quelle

2016-06-12 20:32:06

Versucht, Benutzereingaben aus einem Textfeld zu lesen und sie in Javascript auszudrucken?

Antwort

Verwandte Themen