Question

我在页面上有3个html范围滑块字段，我想将它们的值存储在cookie中，这样滑块就会保存用户在滚动页面时选择的数据，然后再返回。我需要将它保存3个小时左右。

<input type="range" id="loan" name="loan" min="5000" max="500000" step="5000">
<input type="range" id="period" name="period" min="1" max="15">
<input type="range" id="earn" name="earn" min="5000" max="500000" step="5000">

我是javascript＆amp;的新手PHP。我用google搜索过教程，但我见过的样本看起来比我需要的更复杂。

Answer 1

这应该有效。这两个函数应该允许您按名称/值/时间设置cookie并按名称返回它们。由于您要求三个小时，我已经完成了3 * 60 * 60 * 1000来获取设置cookie的毫秒数。您可以根据需要进行更改。

function setCookie(cname, cvalue, time) {
    var d = new Date();
    d.setTime(d.getTime() + time);
    var expires = "expires="+ d.toUTCString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
}

function getCookie(cname) {
    var name = cname + "=";
    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);
        }
        if (c.indexOf(name) == 0) {
            return c.substring(name.length,c.length);
        }
    }
    return "";
}

setCookie('loan',document.getElementById('loan').value,10800000);

getCookie('loan');

Answer 2

我建议您使用localStorage：

<input type="range" id="loan" name="loan" min="5000" max="500000" step="5000">
<input type="range" id="period" name="period" min="1" max="15">
<input type="range" id="earn" name="earn" min="5000" max="500000" step="5000">

//When you want to save values in localStorage
localStorage.setItem('loan', document.getElementById("loan").value );
localStorage.setItem('period', document.getElementById("period").value );
localStorage.setItem('earn', document.getElementById("earn").value );

//When you want to access already stored values:
var loan = localStorage.getItem('loan');
var period = localStorage.getItem('period');
var earn = localStorage.getItem('earn');

当您第一次尝试访问这些属性时，即当您没有将这些值存储在“localStorage”中时，您将获得null。您可能需要使用parseInt()或parseFloat()，具体取决于您的需求，因为此处返回的值将采用String格式。

Answer 3

您可以将整个表单转换为包含innerHTML的字符串，然后保存该字符串。

示例（整个表格）：

var stringToCookie = document.getElementById('myForm').innerHTML;

但是你丢失了JavaScript修改，事件等......

如何在cookie中存储html表单元素？

3 个答案: