javascript - 登录后记住用户数据并选中复选框

时间:2015-02-24 19:57:27

标签: javascript forms checkbox login

我正在帮助客户网站上的改进。在其中一项改进中,有登录表单。我想添加一个复选框,当用户在选中此复选框后登录时,它会记住他的登录数据。

我的登录表单:

<form id='formLogin' method='post' name='formLogin'> <!-- action="telaInicial"> -->
        <label for="usuario">{label_index_user}</label><input name="usuario" id="usuario" type="text" /><br />
        <label for="senha">{label_index_password}</label><input name="senha" id="senha" type="password" maxlength="8" /><br />
        <div id="btLogin"><input type='button' id='entrar' value="{label_index_enviar}"/></div>
        <div id="btLogout"><input type='button' id='deslogar' value="{label_index_sair}"/></div>
        <br><div id="checkLembraDados"><input type='checkbox' id='lembrar' />{label_index_lembrardados}</div>
        <a id="esqueciSenha" href='#' >{label_index_esquecisenha}</a>
    </form>

所以我想我需要把我的JS文件放在:

$("#lembrar").click(function() {
        if document.getElementById("lembrar").checked = true {
            // CODE FOR REMEMBERING DATA FOR FUTURE LOGINS
        }
    });

我不知道我是否明确表达了这个问题。但我觉得放在页面上很简单。

感谢您的帮助。

3 个答案:

答案 0 :(得分:0)

你使用JS来连接和查询数据库吗? 通常你设置一些东西来摧毁一个会话..让他登录不要破坏它...简单?

e.g。 在php:

session_destroy();

打破会议......你可以这样做:

if(keep_logged) #the person checked the stay logged in box
{
  $_SESSION['stayalive']=true;
}

会话终结者:

if($_SESSION['keepalive'] == false && inactive_time > 1hour) session_destroy();

问题是你必须终止会话并销毁它们..这是在注销页面中设置的..但如果他没有注销(关闭浏览器)会发生什么?您保持登录 直到Cookie过期 (在服务器配置中设置),

所以devs做的是设置一个函数来检查最后一个动作的时间和当前动作的时间并查看不同...有些设置min_ inactive对于session_destory()工作到1小时..更多,更少......你只需要设置旁路条件

答案 1 :(得分:0)

我建议使用javascript&#39; localStorage Cookie

localStorage的

使用本地存储,Web应用程序可以在用户的​​浏览器中本地存储数据。

在HTML5之前,应用程序数据必须存储在cookie中,包含在每个服务器请求中。本地存储更安全,可以在本地存储大量数据,而不会影响网站性能。

与Cookie不同,存储限制要大得多(至少5MB),信息永远不会传输到服务器。

本地存储是每个域。来自一个域的所有页面都可以存储和访问相同的数据。

链接可帮助您入门: http://www.w3schools.com/html/html5_webstorage.asp

<强>缓存

Cookie是计算机上存储在小文本文件中的数据。

当Web服务器向浏览器发送网页时,连接将关闭,服务器会忘记用户的所有内容。

发明Cookie是为了解决问题&#34;如何记住用户的信息&#34;:

当用户访问网页时,他的名字可以存储在cookie中。 下次用户访问该页面时,cookie会记住&#34;他的名字。

链接可帮助您入门: http://www.w3schools.com/js/js_cookies.asp

答案 2 :(得分:0)

首先,我认为您需要清除此代码。为此您首先需要将jquery库添加到您的html代码中。

$("#lembrar").click(function() {
    if($(this).is(":checked")){
        // CODE FOR REMEMBERING DATA FOR FUTURE LOGINS
    }
});

现在,为了在客户端存储用户数据,您可以使用2个javascript函数。

// cname  - name in which you want to store your user data
// cvalue - value of that userdata
// exdays - expire in how much days
// ex: setCookie('user','jay',1)
function setCookie(cname, cvalue, exdays) {
    var d = new Date();
    d.setTime(d.getTime() + (exdays*24*60*60*1000));
    var expires = "expires="+d.toUTCString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
}

// cname - name in which you store your user value
// ex : getCookie('user')  -->  'jay' as output
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 "";
}

注意:通过cookie存储用户数据取决于浏览器。如果用户手动删除浏览器的所有cookie,则没有到期日期的含义。