如何保存javascript变量


How to save a javascript variable

我有一个javascript变量,它由.php脚本中的一个javascript函数递增,唯一的问题是当调用该函数时页面会重新加载,所以我需要一些方法来保存变量,使其在重新加载页面时或在您输入时保持不变。我知道你可以进行本地保存,但我不确定当你离开网站时它是否保存了变量。

我的变量在一个html脚本中。

<script type="text/javascript"> 
                    var varNumber= 1;
                    document.getElementById("varNumber").innerHTML = varNumber;
                    document.getElementByID("varNumber").value = varNumber;

                    function addToVariable() {
                        varNumber= varNumber+ 1 ;
                        document.getElementById("varNumber").innerHTML = varNumber;
                    }
                </script>

以下是三种在页面刷新期间保存JavaScript变量的客户端方法,并描述了它们可以保存数据的时间。

使用本地存储保存JavaScript变量

使用现代浏览器,使用本地存储保存JS变量既简单又方便。

var get = function (key) {
  return window.localStorage ? window.localStorage[key] : null;
}
var put = function (key, value) {
  if (window.localStorage) {
    window.localStorage[key] = value;
  }
}

保存和读取对象而不是简单变量:

localStorage.yourObject = JSON.stringify(obj);
obj = JSON.parse(localStorage.yourObject || "{}");

持久性:

如果用户配置了用户代理,则用户代理可以自动删除一段时间后存储的数据。

例如,用户代理可以配置为处理第三方本地存储区域作为仅会话存储,删除数据一次用户已经关闭了所有可以访问它的浏览上下文

这可能会限制网站跟踪用户的能力,因为网站则只能在多个会话中跟踪用户当他与网站本身进行身份验证时(例如,通过购买或登录到服务)。

然而,这也降低了API作为一个长期的有用性存储机制。如果用户并不完全理解数据过期的含义。

参考文献:

  • http://dev.w3.org/html5/webstorage/
  • 在浏览器刷新期间持久化JavaScript对象中的值
  • localStorage的持久性如何

使用Cookie保存JavaScript变量

使用cookie保存变量:

function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
}

持久性:

会话cookie-这些是临时的,在您关闭时会被删除会话结束时使用浏览器。

持久cookie-这些cookie将保留在客户端硬盘上,直到它们被擦除或过期。

这最终取决于用户。他们可能对Cookie和本地存储,并在全部的

REF:使用JavaScript 设置cookie并获取cookie


使用window.name保存JavaScript变量

您也可以使用窗口的名称window.name来使用JavaScript会话存储信息。

持久性:

只有在使用相同的窗口/选项卡时,此操作才有效。

参考:http://www.thomasfrank.se/sessionvars.html

您可以在客户端上使用localStorage

<script>
  localStorage.setItem("mykey",99); // set a variable
  var varNumber = localStorage.getItem("mykey"); // retrieve variable
</script>

您可以使用AJAX来执行PHP,例如:

<?php
session_start(); $r = array();
if(isset($_POST['holdNumber'])){ // assumes {holdNumber:numberHere} sent through AJAX
  if(preg_match('/^'d+$/', $_POST['holdNumber']){
    $r['heldNumber'] = $_SESSION['holdNumber'] = $_POST['holdNumber'];
  }
  else{
    // holdNumber hack
  }
}
elseif(isset($_POST['load'])){
  if(+$_POST['load'] === 1){ // assumes sending {load:1} in AJAX
    if(isset($_SESSION['holdNumber']){
      $r['heldNumber'] = $_SESSION['holdNumber'];
    }
    else{
      $r['heldNumber'] = $_SESSION['holdNumber'] = 0;
    }
  }
  else{
    // load hack
  }
}
echo json_encode($r);
?>