Печать объекта json из локального хранилища

Мне нужно напечатать массив объектов json, которые были введены пользователем через текстовое поле, эта функция выполняется нажатием кнопки. Мне нужно сохранить все строки, которые были введены пользователем в текстовом поле. и отображать его в моей консоли в этом формиата [{"aaa"},{"bbb"},{"ccc"}]Печать объекта json из локального хранилища

<!DOCTYPE html> 
<html> 
    <body> 
    Enter the string : 
    <input type="text" id="names"> 
    <button onclick="myFunction()"> Click Me</button> 

    <script> 
    function myFunction(){ 
     var myNames = new Array(); 
     myNames = document.getElementById("names").value; 
     this.names = myNames; 

     localStorage["myNames"] = JSON.stringify(myNames); 
     console.log(JSON.stringify(myNames)); 

     var name = JSON.parse(localStorage["myNames"]); 
     console.log(name); 
    }; 
    </script> 
    </body> 
</html>

В настоящее время этот код просто напечатать данные, как этот "aaa", если добавить еще данные bbb, только 2-й данные отображаются "bbb". Я хочу, чтобы все данные были просмотрены в этом formate [{"aaa"},{"bbb"},{"ccc"}] или даже как это [{"name": "aaa"}, {"name": "bbb"}, {"name": "ccc"}]. Может кто-нибудь мне помочь?

источник

2016-03-11 Yokesh Varadhan

Примечание: Это всегда лучше иметь свой сценарий как раз перед закрытием ''. – Cohars

@Cohars - Это неправда. Есть обстоятельства, когда лучше иметь его в голове. – Quentin

Также обратите внимание, что '[{" aaa "}, {" bbb "}, {" ccc "}]' недействителен JSON. @Quentin, да, большую часть времени он избавляет вас от некоторых ошибок. Здесь все нормально, потому что 'document.getElementById (« names »)' находится в функции. Я должен быть на улице. – Cohars

вы можете попробовать это:

var myNames = [] 

    function myFunction(){ 
     var oldItems = JSON.parse(localStorage.getItem('myNames')) || []; 

     newItem = {"name":document.getElementById("names").value}; 
     oldItems.push(newItem); 

     localStorage.setItem("myNames", JSON.stringify(oldItems)); 

     console.log(JSON.parse(localStorage.getItem("myNames"))); 
    };

источник

2016-03-11 12:57:44 harry

Я получаю как это ["", "dd", "ddd", "gg", "ggg"], есть ли какая-либо возможность сделать это [{"aaa"}, {" bbb "}, {" ccc "}] или [{" name ":" aaa "}, {" name ":" bbb "}, {" name ":" ccc "}] –

Это не связано с localStorage или JSON. Когда вы выполняете myNames = document.getElementById("names").value;, вы заменяете пустой массив строкой.

Вы можете использовать .С на массиве: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/push

И создать то объект толкая его, например myObj = {'v': value}; myArray.push(myObj);

источник

2016-03-11 12:54:21 Lpu8er

Вышеприведенный пример отлично работает, может дать некоторую ссылку, чтобы подробно узнать о JSON –

Если вы хотите сохранить ранее введенные данные, вы должны получить их первыми и изменить их.

Ниже представлены две функции; который добавляет элемент в массив. Если массив еще не представлен (поэтому ранее данные не были введены), он создает для вас новый массив.

Впоследствии он сохраняет данные в localStorage снова.

При вводе новых данных, которые необходимо добавить, он сначала извлекает все предыдущие записи и изменяет их. Затем он снова хранится и так далее и так далее.

function myFunction(){ 
    var myNames = localStorage.getItem('myNames'), 
     parsedArray = JSON.parse(myNames), 
     valueToAdd = document.getElementById("names").value; 

    // Add the new item to the original array. 
    parsedArray = addToArray(parsedArray, valueToAdd); 
    localStorage.setItem('myNames', JSON.stringify(parsedArray)); 

    console.log(parsedArray); 
}; 

function addToArray (array, item) { 
    // If the array doesn't exist, create one 
    if (!array) { 
    array = []; 
    } 

    // Add the item to the array. 
    array.push(item); 

    return array; 
};

источник

2016-03-11 12:56:19 Matthijs

Я получаю ошибку 4 Uncaught TypeError: localStorage.get не является функциейmyFunction @ jsontest.html: 14onclick @ jsontest.html: 80 –

Неплохо, что должен был быть localStorage.getItem – Matthijs

Печать объекта json из локального хранилища

ответ

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