2016-05-30 9 views
0

Ich würde gerne wissen, wie ein Wert aus einem HTML-Eingabefeld nach einem Klick auf ein JavaScript-Array und dann, wie diese Array-Daten auf dem Bildschirm angezeigt werden.Wie speichert man einen Wert aus einem HTML-Eingabefeld in einem Javascript-Array?

Danke, unten ist mein HTML-Code:

<!DOCTYPE HTML> 

<html> 
<head> 
    <title>Checklist</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
</head> 
<body> 

    <input type="text" id="item" placeholder="Enter an item"> 
    <button id="add">Add Item</button> 

</body> 
</html> 
+0

Leider auch. Ja, ich habe es geändert. – Alexander

+0

@ user3278038 Möchten Sie die gleiche Datei aktualisieren oder bei jedem Speichern eine neue Datei erstellen? – guest271314

+0

@ RokoC.Buljan Ich änderte die Frage von der Speicherung von Daten in eine JSON-Datei, in ein Array. Vielen Dank. – Alexander

Antwort

1

Sie ein Array erstellen, bei Klick auf button schieben input type="text" Element Wert Array; Verwenden Sie zum Herunterladen der Datei window.open()data URI vom Typ application/octet-stream. Um vorhandene Dateien zu aktualisieren, können Sie das Element <input type="file"> für den Benutzer zum Hochladen derselben Datei, die heruntergeladen wurde, verwenden, den aktuellen Wert input type="text" in dieselbe Datei schieben und den Benutzer auffordern, die Originaldatei mit demselben Namen herunterzuladen. Obwohl es eine Entscheidung des Benutzers ist, eine Datei herunterzuladen.

Siehe Edit, save, self-modifying HTML document; format generated HTML, JavaScript

<!DOCTYPE HTML> 
<html> 
<head> 
    <title>Checklist</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
    <script> 
    $(function() { 
     var input = $(":text"); 
     var button = $("button"); 
     var arr = []; 
     button.click(function() { 
     arr.push(input.val()); 
     input.val(""); 
     window.open("data:application/octet-stream," + JSON.stringify(arr)); 

     }) 
    }) 
    </script> 
</head> 
<body> 

    <input type="text" id="item" name="save" placeholder="Enter an item"> 
    <button id="add">Add Item</button> 

</body> 
</html> 

plnkr http://plnkr.co/edit/cQZznvyltX46UO1Y0lDG?p=preview

+0

Sorry, ich habe die Frage vom Speichern in eine Datei in ein Array geändert. – Alexander

+0

@ user3278038 Ja, Javascript auf Post erreicht dies. Sie können 'window.open (" Daten: application/octet-stream, "+ JSON.stringify (arr));' portion entfernen. 'arr' sollte den Wert von' # item' Element enthalten, das bei jedem Klick auf 'button' Element in' arr' array geschoben wird – guest271314

+0

@ user3278038 Siehe updated plnrr http://plnkr.co/edit/cQZznvyltX46UO1Y0lDG?p=preview – guest271314

Verwandte Themen