JSON

Ïê½âHTML5 LocalStorage ±¾µØ´æ´¢

×ÖºÅ+ ×÷ÕߣºH5Ö®¼Ò À´Ô´£ºH5Ö®¼Ò 2017-01-02 11:03 ÎÒÒªÆÀÂÛ( )

±¾ÆªÎÄÕÂÖ÷Òª½éÉÜÁËHTML5 LocalStorage ±¾µØ´æ´¢ £¬HTML5 storageÌṩÁËÒ»ÖÖ·½Ê½ÈÃÍøÕ¾Äܹ»°ÑÐÅÏ¢´æ´¢µ½Äã±¾µØµÄ¼ÆËã»úÉÏ£¬²¢ÔÙÒÔºóÐèÒªµÄʱºò½øÐлñ

Ïê½âHTML5 LocalStorage ±¾µØ´æ´¢

×÷Õߣº·ãÁæÒä ×ÖÌ壺[ ] À´Ô´£º»¥ÁªÍø ʱ¼ä£º12-23 11:00:49 ÎÒÒªÆÀÂÛ

±¾ÆªÎÄÕÂÖ÷Òª½éÉÜÁËHTML5 LocalStorage ±¾µØ´æ´¢ £¬HTML5 storageÌṩÁËÒ»ÖÖ·½Ê½ÈÃÍøÕ¾Äܹ»°ÑÐÅÏ¢´æ´¢µ½Äã±¾µØµÄ¼ÆËã»úÉÏ£¬²¢ÔÙÒÔºóÐèÒªµÄʱºò½øÐлñÈ¡¡£ÓÐÐËȤµÄ¿ÉÒÔÁ˽âһϡ£

1.Ç°ÑÔ

HTML5 storageÌṩÁËÒ»ÖÖ·½Ê½ÈÃÍøÕ¾Äܹ»°ÑÐÅÏ¢´æ´¢µ½Äã±¾µØµÄ¼ÆËã»úÉÏ£¬²¢ÔÙÒÔºóÐèÒªµÄʱºò½øÐлñÈ¡¡£Õâ¸ö¸ÅÄîºÍcookieÏàËÆ£¬Çø±ðÊÇËüÊÇΪÁ˸ü´óÈÝÁ¿´æ´¢Éè¼ÆµÄ¡£CookieµÄ´óСÊÇÊÜÏ޵ģ¬²¢ÇÒÿ´ÎÄãÇëÇóÒ»¸öеÄÒ³ÃæµÄʱºòcookie¶¼»á±»·¢Ë͹ýÈ¥¡£HTML5µÄstorageÊÇ´æ´¢ÔÚÄãµÄ¼ÆËã»úÉÏ£¬ÍøÕ¾ÔÚÒ³Ãæ¼ÓÔØÍê±Ïºó¿ÉÒÔͨ¹ýJavascriptÀ´»ñÈ¡ÕâЩÊý¾Ý¡£Ê×ÏÈ×ÔÈ»ÊǼì²âä¯ÀÀÆ÷ÊÇ·ñÖ§³Ö±¾µØ´æ´¢¡£ÔÚHTML5ÖУ¬±¾µØ´æ´¢ÊÇÒ»¸öwindowµÄÊôÐÔ£¬°üÀ¨localStorageºÍsessionStorage£¬´ÓÃû×ÖÓ¦¸Ã¿ÉÒÔºÜÇå³þµÄ±æÈ϶þÕßµÄÇø±ð£¬Ç°ÕßÊÇÒ»Ö±´æÔÚ±¾µØµÄ£¬ºóÕßÖ»ÊÇ°éËæ×Åsession£¬´°¿ÚÒ»µ©¹Ø±Õ¾ÍûÁË¡£¶þÕßÓ÷¨ÍêÈ«Ïàͬ£¬ÕâÀïÒÔlocalStorageΪÀý¡£

if(window.localStorage){ alert('Ö§³ÖlocalStorage'); }else{ alert('²»Ö§³ÖlocalStorage'); }

2.»ù±¾Ó÷¨

´æ´¢Êý¾ÝµÄ·½·¨¾ÍÊÇÖ±½Ó¸øwindow.localStorageÌí¼ÓÒ»¸öÊôÐÔ£¬ÀýÈ磺window.localStorage.a »òÕß window.localStorage["a"]¡£ËüµÄ¶ÁÈ¡¡¢Ð´¡¢É¾³ý²Ù×÷·½·¨ºÜ¼òµ¥£¬ÊÇÒÔ¼üÖµ¶ÔµÄ·½Ê½´æÔڵģ¬ÈçÏ£º

localStorage.name = "kobi";//ÉèÖÃnameΪ"kobi" localStorage["name"] = "koko";//ÉèÖÃnameΪ"koko"£¬¸²¸ÇÉÏÃæµÄÖµ localStorage.setItem("age","18");//ÉèÖÃageΪ"18" var a1 = localStorage["name"];//»ñÈ¡nameµÄÖµ var a2 = localStorage.age;//»ñÈ¡ageµÄÖµ var b = localStorage.getItem("name");//»ñÈ¡nameµÄÖµ localStorage.removeItem("c");//Çå³ýcµÄÖµ

ÕâÀï×îÍƼöʹÓõÄ×ÔÈ»ÊÇgetItem()ºÍsetItem()£¬Çå³ý¼üÖµ¶ÔʹÓÃremoveItem()¡£Èç¹ûÏ£ÍûÒ»´ÎÐÔÇå³ýËùÓеļüÖµ¶Ô£¬¿ÉÒÔʹÓÃclear()¡£ÁíÍ⣬HTML5»¹ÌṩÁËÒ»¸ökey()·½·¨£¬¿ÉÒÔÔÚ²»ÖªµÀÓÐÄÄЩ¼üÖµµÄʱºòʹÓã¬ÈçÏ£º

var storage = window.localStorage; function showStorage(){ for(var i=0;i<storage.length;i++){ //key(i)»ñµÃÏàÓ¦µÄ¼ü£¬ÔÙÓÃgetItem()·½·¨»ñµÃ¶ÔÓ¦µÄÖµ document.write(storage.key(i)+ " : " + storage.getItem(storage.key(i)) + "<br>"); } }

 3.ÒµÎñÐèÇó

±íµ¥ÊµÊ±±£´æÊý¾Ý£¬Ï´δò¿ªÔòÌáʾÊÇ·ñ¼ÌÐø±à¼­¡£Í¼Æ¬µÈ¿Ø¼þ²»Ö§³Ö£¬Ö»Ö§³Ö¼òµ¥µÄ¿Ø¼þ¡£¡¾·ÀֹͻȻ¶Ïµç»òä¯ÀÀÆ÷±ÀÀ£Ê±£¬Ï´δò¿ª»¹¿ÉÒÔ¼ÌÐø±à¼­²¢±£´æ¡¿¡£ÕâÑù×ÔÈ»¶øÈ»¾ÍÏëµ½ÁËHTML5µÄ±¾µØ´æ´¢¹¦ÄÜ¡£¼ÈÈ»jsдµÄÀã¬Ð´µÄ²î£¬¾Íµ±Á·ÊÖÁË¡£

ÆäʵÕâЩÊý¾ÝµÄ±£´æºÜ¼òµ¥£¬Î޷ǾÍÊÇһЩ¼òµ¥µÄ±êÇ©Êý¾ÝµÄ±£´æ¡£ÏÈÀ´Ò»¸ö×î¼òµ¥µÄjs°æ±¾¡£

/** * ¹¦ÄÜ£º±£´æÓû§ÐÞ¸ÄÍêform±êÇ©ÄÚÈÝÔÚLocalStorageÖС£ * ×÷Õߣº»Æ½ð·æ * °æ±¾£ºversion 2.0 */ define(function () { //´ÓlocalStorageÖмÓÔØÊý¾Ý function onload(form) { var fh = form_handler; var p = fh.getParams(form); if (!p.bimId || !p.formId || !p.iid) { return; } var id = 'FORM_' + DCI.LoginUser.UserId + '_' + p.bimId + '_' + p.formId + '_' + p.iid; //alert(id); var formDataDb; var allControl = $(form).find("input:text[name],textarea[name]"); //´Ó±¾µØÈ¡ var storage = localStorage.getItem(id); if (storage != null) { var myData = JSON.parse(storage); allControl.each(function (i, e) { var name = $(e).attr("name"); if (myData[name] != null) { $(e).val(myData[name]); $(e).change(); } }); } //°ó¶¨changeʼþ allControl.each(function (i, el) { var name = $(el).attr('name'); if (name) { $(el).on('change', function () { onchange(this); }); } }); //±£´æÐ޸ĵÄÊý¾Ý function onchange(el) { var storage = localStorage.getItem(id); if (storage == null) { formDataDb = new Object(); var key = $(el).attr("name"); var value = $(el).val(); formDataDb[key] = value; localStorage.setItem(id, JSON.stringify(formDataDb)); } else { var myData = JSON.parse(storage); var key = $(el).attr("name"); var value = $(el).val(); myData[key] = value; localStorage.setItem(id, JSON.stringify(myData)); } } }; //ɾ³ýlocalStorageÖеÄÊý¾Ý function onsave(form) { var fh = form_handler; var p = fh.getParams(form); var id = 'FORM_' + DCI.LoginUser.UserId + '_' + p.bimId + '_' + p.formId + '_' + p.iid; localStorage.removeItem(id); var allGrid = $(form).find(".form-table"); var formId = $(form).data("formid"); allGrid.each(function (index,element) { var formName = $(element).find("input:hidden[data-formid]").attr("name"); var storageKey = "FORM_" + formId + "_" + formName; localStorage.removeItem(storageKey); }); } return { onload: onload, onsave: onsave, } });

±íµ¥¶¼ÊÇ×Ô¶¯Í¨¹ýÄ£°æÉú³ÉµÄ£¬ÕâÀ︽ÉÏ±íµ¥¼ÓÔØÐèÒªµÄform.js.

´úÂëÌ«³¤£¬ÕâÀï¾Í²»Ö±½ÓÌù³öÀ´ÁË£¬´ó¼Ò×Ô¼ºÏÂÔØÏÂÀ´¿´°É µã»÷ÕâÀïÏÂÔØ

4.Grid¿Ø¼þµÄÊý¾Ý±£´æ

Grid¿Ø¼þÆäʵ¾ÍÊÇÒ»¸ödiv£¬¹«Ë¾µÄһЩҳÃæ±íµ¥¶¼ÊǶ¯Ì¬Éú³ÉµÄ£¬±íµ¥ÉÏÃæµÄ¿Ø¼þÒ²ÊǶ¯Ì¬Éú³ÉµÄ£¬ËùÓкܶණÎ÷¶¼ÊÇ×Ô¼ºÊÖдµÄ¡£ÏÂÃæÊÇGrid¿Ø¼þµÄ½á¹¹¡£

¡¡

1.±¾Õ¾×ñÑ­ÐÐÒµ¹æ·¶£¬ÈκÎתÔصĸå¼þ¶¼»áÃ÷È·±ê×¢×÷ÕߺÍÀ´Ô´£»2.±¾Õ¾µÄÔ­´´ÎÄÕ£¬ÇëתÔØʱÎñ±Ø×¢Ã÷ÎÄÕÂ×÷ÕߺÍÀ´Ô´£¬²»×ðÖØÔ­´´µÄÐÐΪÎÒÃǽ«×·¾¿ÔðÈΣ»3.×÷ÕßͶ¸å¿ÉÄܻᾭÎÒÃDZ༭Ð޸Ļò²¹³ä¡£

Ïà¹ØÎÄÕÂ
  • JavaScriptÉ½Ì³Ì¡ª¡ªsessionStorageºÍlocalStorage

    JavaScriptÉ½Ì³Ì¡ª¡ªsessionStorageºÍlocalStorage

    2016-09-15 18:02

  • ͻϮHTML5Ö®Javascript APIÀ©Õ¹3¡ª±¾µØ´æ´¢È«ÐÂÌåÑé

    ͻϮHTML5Ö®Javascript APIÀ©Õ¹3¡ª±¾µØ´æ´¢È«ÐÂÌåÑé

    2015-11-25 09:21

  • »ùÓÚhtml5 localStorageµÄ¹ºÎï³µJS½Å±¾

    »ùÓÚhtml5 localStorageµÄ¹ºÎï³µJS½Å±¾

    2015-11-18 08:26

ÍøÓѵãÆÀ
´