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

时间:2018-06-06 00:27:02

标签: 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>

如果你能提供帮助,我们将非常感激! ^^

2 个答案:

答案 0 :(得分:1)

checkCookie中,如果用户的Cookie存在,请从btc检索localStorage值(如果存在)。否则,将btc值设置为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时进行字符串化/解析。

答案 1 :(得分:-1)

而不是设置: var btc = 1; 您可以使用local storage,如下所示:

function getBtc = (is_update_btc) => {
    // to get from local storage
    let btc_start = window.localStorage.get('btc') || 1;
    // e.g.
    // if (is_update_btc) {
    //    btc_start = btc_start + 1;
    //}    
    // to set back to local storage after whatever manipulation:
    window.localStorage.set('btc', btc_start);
};

let btc = getBtc();