javascript - 如何在 JS 中定义一次变量?

标签 javascript html css

所以,我有我的代码,我知道问题所在,但我不知道如何解决它。

每当您加载页面时,我的“btc”变量都会重新定义,使其始终加载为 1,我如何让 btc 加载一次,并且在 cookie“用户名”的生命周期内只加载一次?

(我不能再向变量添加'btc',因为当我刷新它时,它总是将它重新定义为一个。)

<html>
<body onload="abu()">
<style>
.column {
    background-color: lightgrey;
    width: 120px;
    border: 12px solid blue;
    padding: 19.5px;
    margin: 19.5px;
}
.col {
    background-color: lightgrey;
    width: 120px;
    border: 12px solid red;
    padding: 19.5px;
    margin: 19.5px;


}
body{
    background-image: url('https://cdn.shutterstock.com/shutterstock/videos/2669351/thumb/1.jpg');
    background-size: cover;
}
#customers {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

#customers td, #customers th {
    border: 1px solid #ddd;
    padding: 8px;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #ff2a00;
    color: white;
}

</style>
<center><h1>Dashboard</h1></center>
<div class="column"><p id="btc">Satoshi: 0</p></div>
<div class="col"><p id="dash">WIP</p></div>

<!---<table id="customers">
  <tr>
    <th>Name</th>
    <th>Link</th>
    <th>Payout</th>

  </tr>
  <tr>
    <td>FirstSat</td>
    <td><button onclick="foo()"><img src="kop.png" width="32" height="28">Here</button></td>
    <td>1</td>


  </tr>
</table>---!>
<button onclick="testsan()">a</button>
<script>
var btc = 1;
function update()
{
    document.getElementById('btc').innerHTML = "Satoshi: " + btc;
}



abu();
function testsan() {
    var username = parseInt(getCookie("username"));
    btc = btc + 1
    document.getElementById('btc').innerHTML = "Satoshi: " + btc;
    setCookie("username", username + 1);

}
function abu() { 
    var username = parseInt(getCookie("username"));
    if (isNaN(username)) {
        username = 0;
    }

    document.getElementById('btc').innerHTML = "Satoshi: " + btc;
    setCookie("username", username + 1);


}



function setCookie(cname,cvalue,exdays) {
    var d = new Date();
    d.setTime(d.getTime() + (exdays*24*60*60*1000));
    var expires = "expires=" + d.toGMTString();
    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

function getCookie(cname) {
    var name = cname + "=";
    var decodedCookie = decodeURIComponent(document.cookie);
    var ca = decodedCookie.split(';');
    for(var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') {
            c = c.substring(1);
        }
        if (c.indexOf(name) == 0) {
            return c.substring(name.length, c.length);
        }
    }
    return "";
}

function checkCookie() {

    var user=getCookie("username");
    if (user != "") {
        alert("Welcome again " + user);
    } else {
alert('user = "' + user + '"');
       if (user != undefined) {
           setCookie("username", btc);

       }
    }
}

</script>


</html>

如能提供帮助,将不胜感激! ^^

最佳答案

checkCookie , 如果用户的 cookie 存在, 检索 btc来自 localStorage 的值(如果存在)。否则,设置 btc值为 1,均在 localStorage 中并在变量中。例如,假设您运行 checkCookie在每次页面加载时(或在使用 btc 之前:

let btc;
function checkCookie() {
  var user=getCookie("username");
  if (user != "") {
    alert("Welcome again " + user);
    btc = Number(sessionStorage.btc || 1);
  } else {
    alert('user = "' + user + '"');
    if (user != undefined) {
      setCookie("username", btc);
    }
    btc = 1;
  }
}

然后在testsan , 分配给 localStorage :

function testsan() {
  btc = btc + 1;
  localStorage.btc = btc;
  // ...

如果您还想跟踪一个单独的 btc对于每个用户,您必须创建一个用户的对象btc值,并在设置或获取 localStorage 时对其进行字符串化/解析.

关于javascript - 如何在 JS 中定义一次变量?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50710686/

相关文章:

javascript - 如何解析由有符号 8.8 定点表示法表示的十六进制值? (JavaScript)

html - Ng-Model 返回 null 而不是什么都没有

javascript - 如何使 Angular JS 中的 ng-repeat 语句运行有限次数

jquery - MSIE 中的不透明度问题

javascript - 安装和升级基于 Firefox Add-on-SDK 的扩展时强制重新启动

javascript - 以刻度为单位的 HTML - Google 图表 - 列

CSS3 - CSS 动画可能存在 Chrome 浏览器错误?

html - 中心 <h1> 与 {display : inlineblock;}

javascript - Iscroll - Jquery - 获取列表项上的位置

javascript - 检测两个重叠的三 Angular 形并用 javascript 为重叠部分着色