Wie würde ich den Ergebniswert anhängen?

function getNote() { 
 
var textField = document.getElementById('textField').value; 
 
var result = document.getElementById('result'); 
 
result.innerHTML = textField; 
 
} 
 
var submitButton = document.getElementById('submitButton'); 
 
submitButton.addEventListener('click',getNote);

<html lang="en"> 
 
<head> 
 
<div id="wrapper"> 
 
    <div class="topnav" id="myTopnav"> 
 
    <a href="#home">NoteTaker</a> 
 
    
 
</div> 
 
<title>Note Taker</title> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"></head> 
 
<body id="style"> 
 
<div id ="centerField"> 
 
<h1> New Note</h1> 
 
<textarea id="textField"rows="8" cols="70%" placeholder ="Type Here."></textarea> 
 
<br> 
 
<button type="button" id="submitButton" class="btn btn-warning">Submit Information</button> 
 
</div> 
 
<div id ="leftField" > 
 
<h2> Saved Notes</h2> 
 
<p id='result'></p></div> 
 
<div id="container"></div> 
 

 
</div> 
 
</div> 
 
</body> 
 
</html>

möchte ich jeden Wert in das Feld hinzugefügt zu halten. Also, wenn ich Test einreiche und dann Hilfe abschicke, sollte das Feld beides haben. Gerade jetzt fügt es dann ersetzen und jetzt bin ich ratlos.

Quelle

2017-07-28 Dwight Carter

result.innerHTML + = textfield – AirNoir

Ich denke, eine dieser Antworten die Lösung sein könnte. Sie könnten eine Antwort akzeptieren, die eine möglicherweise akzeptable Lösung zitiert. Dies schließt die Schleife. – Sidtharthan

@Sidtharthan Klingt, als ob Sie nach einer Annahme Ihrer Antwort fischen. –

Wenn Sie es nicht überlagern und beibehalten möchten, nehmen Sie den alten Wert und fügen Sie den neuen Wert hinzu.

result.innerHTML = result.innerHTML + " " + textField;

function getNote() { 
 
var textField = document.getElementById('textField').value; 
 
var result = document.getElementById('result'); 
 
result.innerHTML = result.innerHTML + " " + textField; 
 
} 
 
var submitButton = document.getElementById('submitButton'); 
 
submitButton.addEventListener('click',getNote);

<html lang="en"> 
 
<head> 
 
<div id="wrapper"> 
 
    <div class="topnav" id="myTopnav"> 
 
    <a href="#home">NoteTaker</a> 
 
    
 
</div> 
 
<title>Note Taker</title> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"></head> 
 
<body id="style"> 
 
<div id ="centerField"> 
 
<h1> New Note</h1> 
 
<textarea id="textField"rows="8" cols="70%" placeholder ="Type Here."></textarea> 
 
<br> 
 
<button type="button" id="submitButton" class="btn btn-warning">Submit Information</button> 
 
</div> 
 
<div id ="leftField" > 
 
<h2> Saved Notes</h2> 
 
<p id='result'></p></div> 
 
<div id="container"></div> 
 

 
</div> 
 
</div> 
 
</body> 
 
</html>

Quelle

2017-07-28 06:09:19

Hier gehen Sie mit einer Lösung https://jsfiddle.net/spf0bt71/1/

$('#submitButton').click(function(){ 
 
\t var textField = $('#textField').val(); 
 
    $('#result').append(textField, '<br/>'); 
 
    $('#textField').val(''); 
 
});

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id ="centerField"> 
 
    <h1> New Note</h1> 
 
    <textarea id="textField"rows="8" cols="70%" placeholder ="Type Here."></textarea> 
 
    <br> 
 
    <button type="button" id="submitButton" class="btn btn-warning">Submit Information</button> 
 
</div> 
 
<div id ="leftField" > 
 
    <h2> Saved Notes</h2> 
 
    <p id='result'></p> 
 
</div> 
 
<div id="container"></div>

Quelle

2017-07-28 06:12:30 Shiladitya

Hey lerne immer noch, aber die Lösung funktioniert perfekt in Geige, aber wenn ich es selbst versuche ... Mit Code war es nicht funktioniert –

Bitte überprüfen Sie die Browser-Konsole für Fehler ... und bitte geben Sie die Fehlerdetails an, versuchen Sie es gemeinsam zu lösen ... – Shiladitya

danke für die Unterstützung, aber ich konnte es funktionieren :) –

$('#submitButton').click(function(){ 
 
\t $('#result').append($('#textField').val()); 
 
});

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id ="centerField"> 
 
    <h1> New Note</h1> 
 
    <textarea id="textField"rows="8" cols="70%" placeholder ="Type Here."></textarea> 
 
    <br> 
 
    <button type="button" id="submitButton" class="btn btn-warning">Submit Information</button> 
 
</div> 
 
<div id ="leftField" > 
 
    <h2> Saved Notes</h2> 
 
    <p id='result'></p> 
 
</div> 
 
<div id="container"></div>

Quelle

2017-07-28 06:39:19

Die .append() -Methode fügt den angegebenen Inhalt als das letzte Kind ein von jedem Element. Deshalb wird der TextField-Wert jedes Mal an das Ergebnis angehängt. .appendTo() kann anstelle von .append() verwendet werden –

$("#submitButton").on("click", function(){ 
 
$("p#result").append($("#textField").val() + "<br/>"); 
 
});

<html lang="en"> 
 

 
<head> 
 
    <title>Note Taker</title> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
</head> 
 

 
<body id="style"> 
 
    <div id="centerField"> 
 
    <h1> New Note</h1> 
 
    <textarea id="textField" rows="8" cols="70%" placeholder="Type Here."></textarea> 
 
    <br> 
 
    <button type="button" id="submitButton" class="btn btn-warning"> 
 
    Submit Information 
 
    </button> 
 
    </div> 
 
    <div id="leftField"> 
 
    <h2> Saved Notes</h2> 
 
    <p id='result'></p> 
 
    </div> 
 
    <div id="container"></div> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
</body> 
 

 
</html>

Quelle

2017-07-28 07:02:12

Wie würde ich den Ergebniswert anhängen?

Antwort

Verwandte Themen