2016-05-30 4 views
0

Я хотел бы знать, как сохранить значение из поля ввода HTML после нажатия кнопки в массив JavaScript , а затем, как отображать данные массива на экране.Как сохранить значение из поля ввода HTML в массиве javascript?

Спасибо, ниже мой HTML-код:

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

К сожалению. Да, я изменил его. – Alexander

+0

@ user3278038 Вы хотите обновить тот же файл или создать новый файл при каждом сохранении? – guest271314

+0

@ RokoC.Buljan Я изменил вопрос, сохранив данные в файл JSON, в массив. Благодарю. – Alexander

ответ

1

Вы можете создать массив, при щелчке button, нажмите input type="text" значение элемента в массиве; используйте window.open()data URI типа application/octet-stream для загрузки файла. Чтобы обновить существующий файл, вы можете включить элемент <input type="file">, чтобы пользователь мог загрузить тот же загруженный файл, нажимая текущее значение input type="text" в тот же файл, а затем попросите пользователя загрузить оригинальный файл с тем же именем. Хотя обратите внимание, это решение пользователя скачать файл.

Смотрите также 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

Извините, я сменил вопрос о сохранении в файл, в массив. – Alexander

+0

@ user3278038 Да, 'javascript' на почте достигает этого. Вы можете удалить 'window.open (" data: application/octet-stream, "+ JSON.stringify (arr));" часть. 'arr' должен содержать значение элемента' # item', нажимаемого на массив 'arr' при каждом нажатии на элемент' button' – guest271314

+0

@ user3278038 См. обновленный plnkr http://plnkr.co/edit/cQZznvyltX46UO1Y0lDG?p=preview – guest271314

Смежные вопросы