Пользователь начинает с 0.00 и после каждого щелчка изображения зарабатывает дополнительно +0,05.
Так что я
$(document).ready(function(){ $("#image1").one("click",function(){ // } Как я могу создать файл cookie, который хранит 0.00 при загрузке первой страницы, а затем добавляет 0,05 после каждого щелчка изображения? Эта страница должна обновляться после каждого щелчка, поэтому ее нужно сохранить, я полагаю.
Вы можете использовать localStorage
localStorage.setItem('cookieName', 0);
Вы можете получить его, используя
localStorage.getItem('cookieName');
В вашем случае это будет
$(document).ready(function(){ $("#image1").on("click",function(){ localStorage.setItem('cookieName', localStorage.getItem('cookieName') + x); }
Попробуйте это: он использует localStorage если поддерживается, в противном случае использует файлы cookie.
var objCookie = { set: function (name, value, days) { try { var expires = ''; if (days) { var date = new Date(); date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); expires = "; expires=" + date.toGMTString(); } document.cookie = name + "=" + value + expires + "; path=/"; } catch (e) { console.log(e); } }, get: function (name) { try { var nameEQ = name + '=', ca = document.cookie.split(';'); for (var i = 0; i < ca.length; i++) { var c = $.trim(ca[i]); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); } return null; } catch (e) { console.log(e); } }, remove: function (name) { try { objCookie.set(name, '', -1); } catch (e) { console.log(e); } } }; var objLocalStorage = { set: function (name, value) { try { localStorage.setItem(name, value); } catch (e) { // alert('Local Storage is not supported'); objCookie.set(name, value); console.log(e); } }, get: function (name) { try { return localStorage.getItem(name); } catch (e) { // alert('Local Storage is not supported'); return objCookie.get(name); } }, remove: function (name) { try { localStorage.removeItem(name); } catch (e) { // alert('Local Storage is not supported'); objCookie.remove(name); console.log(e); } } }; $(document).ready(function () { objCookie.set('myKey', '0.0'); $("#image1").one("click", function () { objCookie.set(parseFloat(objCookie.get('myKey')) + 0.5); // Refresh: window.location.reload(); }); });
Для этого вы можете использовать localStorage или sessionStorage . Значения, установленные для sessionStorage, будут действовать только до тех пор, пока пользователь не закроет вкладку или его браузер, тогда как loclaStorage будет продолжаться до тех пор, пока он не будет удален. Примечание: dom-storage – это функция html5, поэтому не будет поддерживаться IE <8. См. Здесь для поддержки браузера.
Домен-хранилище позволяет хранить строки, поэтому вам нужно проанализировать значения, чтобы справиться с математическими операциями.
if(!localStorage.getItem('value')){ //check if there already are values saved localStorage.setItem('value', '0.00'); } $(document).ready(function(){ $("#image1").on("click",function(){ var value = parseFloat(localStorage.getItem('value')); //parse the string saved to the storage. value += 0.05; // add your value localStorage.setItem('value', value.toFixed(2)); //round the value to 2 decimals }); });
демонстрация
Чтобы удалить элемент из локального хранилища вручную, вы можете использовать:
localStorage.deleteItem('value');
Если вы хотите использовать файлы cookie, вы можете использовать:
document.cookie="theme=theme-dark"; //setter
а также
var value = document.cookie; //getter
Чтобы напечатать точки на своей странице, вы можете использовать s.th. как показано ниже:
var value = localStorage.getItem('value'); var par = $('<p />'); par.text('You have earned ' + value + ' points'); $('selector').after(par); //or .append() or s.th. similar what fits your needs
Демонстрация 2