非你网

现象

在给网址做 登录注册 功能时，通常会用到ajax。因为它不会刷新页面，给用户的体验很好。但会影响另外一个比较好的体验：浏览器不会弹出记住账号密码。

eg：

<div class="log-bodies">
    <row>
        <span>账号</span>
        <input id="account" type="text" placeholder="请输入账号">
    </row>

    <row>
        <span>密码</span>
        <input id="password" type="password" placeholder="请输入密码">
    </row>

    <button class="log-btn">登录</button>
</div

$(".log-btn").click(function{
    //do ajax post
});

解决方法

俗话说：“鱼和熊掌不能兼得”。今天就不仅要吃鱼，还要吃熊掌。先分析下原因。之所以没有提示保存账号密码，是因为我们没有进行正常的form提交。form提交要满足：

1. 有form表单。

2. 有submit按钮。

当你修改代码为form方式提交，尝试登录时，会发现浏览器刷新了。这里还要做一步，当submit的时候，return掉。

<div class="log-bodies">
    <form method="post" onsubmit="return false;">
        <row>
            <span>账号</span>
            <input id="account" type="text" placeholder="请输入账号">
        </row>

        <row>
            <span>密码</span>
            <input id="password" type="password" placeholder="请输入密码">
        </row>

        <input type="submit" class="log-btn" value="登录"></input>
    </form>
</div

$(".log-btn").click(function{
    //do ajax post
});

云游

清除input的样式：

input{  
   background:none;  
   outline:none;  
   border:0px;  
}  

js正则表单时判断是否手机号码：

var phonenum = '15899589586';

if(/^((13[0-9])|(14[5|7])|(15([0-3]|[5-9]))|(18[0,5-9]))\d{8}$/.test(phonenum) == false)
{
    console.log('不是手机号码');  
}
else
{
    console.log('是手机号码');    
}

媒体查询：

http://www.qdfuns.com/notes/26218/296b9dc57c46b25b429a219392cbcde2.html

http://www.cnblogs.com/zyl-Tara/p/5519144.html

nginx:

https://segmentfault.com/l/1500000009736925

redis:

https://segmentfault.com/l/1500000010000817