关机后JavaScript计数器自定义小工具重置?

时间:2018-06-17 18:48:22

标签: javascript html css windows windows-7

我正在使用Gadget Creator和codeacademy中的代码创建一个Windows 7小工具来跟踪计数。但是,当晚上关机然后第二天再次登录时,重置计数。我是编码新手,所以我正在寻找一些帮助。我只想让它跟踪我当前的计数,无论我是注销还是关闭。

更新7/6/2018 :我去了reddit并请求帮助,有人指出创建文本文件然后从中读取。想知道我将如何在此代码中实现此功能?

UPDATE 7/13/2018 :尝试让它以某种方式读取文本文件后,它错过了整个小工具,所以我又回到了当前发布的代码。仍在寻求帮助!

HTML

<html>
    <head>
    <script type="text/javascript" src="script.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css">
    <title> Counter </title>
    <style>
      body {
      width: 150px;
      height: 115px;

    </style>
  </head>  

<body>

    <div class="box">    
        <label for="qty"><abbr title="Quantity">Video Count</abbr></label>
        <input id="qty" value="0" />
        <button id="down" onclick="modify_qty(-1)">- 1</button>
        <button id="up" onclick="modify_qty(1)">+ 1</button>
    </div>

  </body>
</html>

JS

function modify_qty(val) {
    var qty = document.getElementById('qty').value;
    var new_qty = parseInt(qty,10) + val;

    if (new_qty < 0) {
        new_qty = 0;
    }

    document.getElementById('qty').value = new_qty;
    return new_qty;
}

CSS

body {
    font-family: helvetica, arial, verdana, sans-serif;
    margin: 0;
    padding: 0;
}

input {
    font-size: 2.4em;
    background-color: transparent;
    text-align: center;
    border-width: 0;
    width: 100%;
    margin: 0 0 .1em 0;
    color: #fff;
}

label {
    display: block;
    font-size: .8em;
}

button {
    /* basics */
    color: #444;
    background-color: #B5B198;
    /* rounded corners */
    -webkit-border-radius: 6px;
          border-radius: 6px; 
    -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
    font-weight: bold;

}

button:hover, button:active, button:focus {
    background-color: #CBC7AE;
}

.box {
    /* basics */
    background-color: #444;
    color: #C4BE92;
    text-align: center;

    /* rounded corners */
    -webkit-border-radius: 12px;
    border-radius: 12px; 
    -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
    padding: .8em .8em 1em;
    width: 8em;
    margin: 0 auto;    
      -webkit-box-shadow: 0px 0px 12px 0px #000;
    box-shadow: 0px 0px 12px 0px #000;

}

0 个答案:

没有答案