Javascript - Невозможно добавить больше значений в локальное хранилище

Question

Попытка добавления/изменения локального хранилища со многими страницами. Я создал каждую страницу как независимую страницу, поэтому я могу добавить больше значений в локальное хранилище, которое уже существует. У меня есть одна и та же база кода для всех страниц, но получаю Uncaught TypeError: Cannot set property 'futureOfVenues' of undefined на одной странице. Идея состоит в том, чтобы добавлять новые значения без удаления старых данных.

Ключ: ext-adv.pres3318 Значение: {"presID":"3318","firstName":"asdasasd","lastName":"asdasd","company":"asdas","emailAddress":"asdasda"}

Мой вопрос, почему я получаю эту ошибку на странице только и того, что является лучшим способом для добавления новых значений в памяти без перезаписи/удаления старых данных?

var criteriaSlide = function() { 

    var self = this; 
    var futureOfVenue = document.getElementById('future-of-booking'); 

    var theName = 'ext-adv.pres'; 
    var theKey = theName + getPresentationID(); 

/* 
** Create object if it doesn't already exists 
*/ 
this.createObject = function() { 
    if (localStorage.getItem(theKey) === null) { 
    localStorage.setItem(theKey, JSON.stringify({ 
     presID: getPresentationID().replace(/\D/g,'') 
    }) 
)} 
} 

/* 
** Load the whole object 
*/ 
this.theStoredObject = function() { 
    self.theObject = localStorage.getItem(theKey); 
    self.theObject = JSON.parse(self.theObject); 
} 

/* 
** Get values from local storage 
*/ 
this.loadData = function(el){ 
    if (typeof theKey !== 'undefined' && theKey !== null) { 
     self.theData = localStorage.getItem(theKey); 
     self.theData = JSON.parse(self.theData); 
     return self.theData[el]; 
    } 
    else { 
    return false; 
    } 
}; 

/* 
** Populate Data 
*/ 
this.populateData = function() { 
if (localStorage.getItem(theKey) === null) { 
    return false; 
} 

else { 
    $('input').each(function() { 
    var id = $(this).attr('id'); 
    $('#' + id).val(self.loadData(id)); 
    }); 
} 
} 

/* 
** Update on key change 
*/ 
$('textarea[name="futureofbooking"]').on('keyup', function(){ 

futureOfVenue.value = $(this).val(); 
    criteriaSlide.saveData(); 
}); 

/* 
** Save data to local storage 
*/ 
this.saveData = function() { 
//self.theData.keyCriteriaForVenues = keyCriteria.value; 
console.log(futureOfVenue.value); 
self.theData.venueBooking = futureOfVenue.value; 
localStorage.setItem(theKey, JSON.stringify(self.theData)); 
} 
} 

//Document ready 
//Initialise Slide 
$(function(){ 
'use strict' 
    criteriaSlide = new criteriaSlide(); 
    criteriaSlide.createObject(); 
    criteriaSlide.populateData(); 
    criteriaSlide.theStoredObject(); 
}); 

Answer 1

См What happens when localStorage is full?

Исключение вашего получают говорит вам, что есть проблема с кодом, не то, что LocalStorage полна. Убедитесь, что localStorage в какой-то момент не перезаписывается. Я был бы в состоянии помочь вам, если вы опубликуете JSFiddle или что-то еще.

PS: Несмотря на то, что рекомендуется установить и получить свойства от LocalStorage с помощью SetItem/GetItem, вы можете также использовать его как объект и проверить наличие ключей, как так:

('futureOfVenue' in localStorage)