jQuery技术:使用cookie来存储和获取整数

用户以0.00开始,每次点击图像后,他们额外获得+0.05。

所以我有

$(document).ready(function(){ $("#image1").one("click",function(){ // } 

如何在第一页加载时创建存储0.00的cookie,然后在每次单击图像后添加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 。 设置为sessionsStorage的值将仅持续到用户关闭选项卡或其浏览器,而loclaStorage将持续到删除为止。 注意:dom-storage是一个html5function,因此IE <8不支持。请参阅此处获取浏览器支持。

    dom-storage只允许存储字符串,因此您必须解析值以应对数学运算。

     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中删除项目,您可以使用:

     localStorage.deleteItem('value'); 

    如果您想使用cookie,您可以使用:

     document.cookie="theme=theme-dark"; //setter 

     var value = document.cookie; //getter 

    要将点打印到页面,您可以使用s.th. 如下:

     var value = localStorage.getItem('value'); var par = $('

    '); par.text('You have earned ' + value + ' points'); $('selector').after(par); //or .append() or s.th. similar what fits your needs

    演示2

    需要了解更多jQuery教程分享使用cookie来存储和获取整数,都可以关注jQuery技术分享栏目---计算机技术网(www.ctvol.com)!

      以上就是jQuery教程分享使用cookie来存储和获取整数相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。

      本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

      ctvol管理联系方式QQ:251552304

      本文章地址:https://www.ctvol.com/jquerytutorial/981942.html

      (0)
      上一篇 2021年12月13日
      下一篇 2021年12月13日

      精彩推荐