使用 jQuery 计数器随机计数 1 或 2,并在达到 97 时使用 cookie 保存数字
Counting randomly 1 or 2 up with jQuery counter and use a cookie to save the number when it reaches 97
我是全新的。也许有人可以帮忙?
我正在尝试制作一个计数器,每 X 秒将我的数字递增 0、1 或 2。
该数字将从 87 开始,一直增加到 97。每次增加 0、1 或 2。
如果用户重新加载页面,计数器会继续,当数字达到 97 时,它会停在那里并显示数字 97 - 同样在重新加载时
到目前为止,我已经可以使用了
HTML:
<p id="offer">87</p>
在脚本标签中:
$(document).ready(function () {
var number = parseInt($('#offer').text()) // Getting my number from the p id
// Called the function in each second
var interval = setInterval(function () {
$('#offer').text(Math.floor(Math.random() * (1 - 0 + 1)) + 1);
if (number > 97) {
clearInterval(interval); // If exceeded 97, stop
}
}, 1000); // Run for each second
});
这就是我尝试将它增加 0、1 或 2 的方法,但这并不完全有效。它显示 0、1 或 2,但不会将其添加到我的号码中。
$(document).ready(function () {
var number = parseInt($('#offer').text()) // Getting my number from the p id
// Called the function in each second
var interval = setInterval(function () {
$('#offer').text(Math.floor(Math.random() * (1 - 0 + 2)) + 0);
if (number > 97) {
clearInterval(interval); // If exceeded 97, stop
}
}, 1000); // Run for each second
});
我应该在哪里以及如何添加 cookie 部分,以“保存”每个页面加载的数量?
目前您的增量器的问题是您从未将新的随机值添加到现有值;新值自行显示。
为了在发生增量时将值存储在元素中,为了简单起见,我建议使用 localStorage 而不是 cookie。在这种情况下,您需要做的就是设置 localStorage 中的值,因为它在时间间隔内更新,并将该值读入加载元素的文本中。像这样:
jQuery($ => {
let $offer = $('#offer');
let storedNumber = localStorage.getItem('number') || 87;
$offer.text(storedNumber);
let interval = setInterval(() => {
let number = parseInt($offer.text(), 10);
if (number > 97) {
clearInterval(interval);
return;
}
number += Math.floor(Math.random() * 3);
$offer.text(number);
localStorage.setItem('number', number);
}, 1000);
});
Working Example - 请注意示例在 Fiddle 中,因为 SO 片段是沙盒化的并且不支持 localStorage。
我是全新的。也许有人可以帮忙?
我正在尝试制作一个计数器,每 X 秒将我的数字递增 0、1 或 2。 该数字将从 87 开始,一直增加到 97。每次增加 0、1 或 2。
如果用户重新加载页面,计数器会继续,当数字达到 97 时,它会停在那里并显示数字 97 - 同样在重新加载时
到目前为止,我已经可以使用了
HTML:
<p id="offer">87</p>
在脚本标签中:
$(document).ready(function () {
var number = parseInt($('#offer').text()) // Getting my number from the p id
// Called the function in each second
var interval = setInterval(function () {
$('#offer').text(Math.floor(Math.random() * (1 - 0 + 1)) + 1);
if (number > 97) {
clearInterval(interval); // If exceeded 97, stop
}
}, 1000); // Run for each second
});
这就是我尝试将它增加 0、1 或 2 的方法,但这并不完全有效。它显示 0、1 或 2,但不会将其添加到我的号码中。
$(document).ready(function () {
var number = parseInt($('#offer').text()) // Getting my number from the p id
// Called the function in each second
var interval = setInterval(function () {
$('#offer').text(Math.floor(Math.random() * (1 - 0 + 2)) + 0);
if (number > 97) {
clearInterval(interval); // If exceeded 97, stop
}
}, 1000); // Run for each second
});
我应该在哪里以及如何添加 cookie 部分,以“保存”每个页面加载的数量?
目前您的增量器的问题是您从未将新的随机值添加到现有值;新值自行显示。
为了在发生增量时将值存储在元素中,为了简单起见,我建议使用 localStorage 而不是 cookie。在这种情况下,您需要做的就是设置 localStorage 中的值,因为它在时间间隔内更新,并将该值读入加载元素的文本中。像这样:
jQuery($ => {
let $offer = $('#offer');
let storedNumber = localStorage.getItem('number') || 87;
$offer.text(storedNumber);
let interval = setInterval(() => {
let number = parseInt($offer.text(), 10);
if (number > 97) {
clearInterval(interval);
return;
}
number += Math.floor(Math.random() * 3);
$offer.text(number);
localStorage.setItem('number', number);
}, 1000);
});
Working Example - 请注意示例在 Fiddle 中,因为 SO 片段是沙盒化的并且不支持 localStorage。