解决password自动填充问题

    写了一个项目，在用户登录时，浏览器老是提示保存登录信息，下次再次访问就会自动登录，我有严重的强迫症，特讨厌这样的效果，于是就在思考，如何使得不让浏览器保存用户登录信息呢？

网上说的一大堆：

1、将表单设置为autocomplete="off"

    此方法我尝试了，如果没有input[type='password']字段还是能够实现不填充的，但是有input[type='password']，此方法就无能为力了，所以我尝试不仅吧表单设置为autocomplete="off"，还把每一项表单内容都设置为autocomplete="off"，但是很遗憾，很失落，还是没有任何的效果，此方法pass掉

2、将input[type='text']和input[type='password']中间增加一下隐藏的input[type='text']，忽悠浏览器，浏览器有那么傻瓜吗？经测试此办法也是胡说八道！

3、将input[type='text']添加一个onfous时间，当触发onfocus时，将input[type='text']修改为input[type='password']，起初貌似可以，但是多点两下，就和最初没啥区别了，纯属误人子弟！

4、经过我一晚上的努力，终于找到了解决办法：

1）把方法1和方法3加上，加上浏览器忽略就算了，万一起作用呢？

2）最重要的是这一步：将<input type="submit"/>修改为<button type="button" id="login">登录</button>

点击button时，验证数据的合法性，如果合法通过ajax发起请求访问服务器验证，验证通过跳转即可。

附录代码实现：

<form method="post" id="form_login" autocomplete="off">
    <input type="password" class="hidden" />
    <input type="text" class="hidden" />
    <div class="lock-holder">
	<div class="form-group pull-left input-username">
	    <label>账号</label>
	    <input name="user_name" id="user_name" autocomplete="off" type="text" class="input-text" value="" required />
        </div>
				
	<i class="fa fa-ellipsis-h dot-left"></i> <i class="fa fa-ellipsis-h dot-right"></i>
        <div class="form-group pull-right input-password-box">
	    <label>密码</label>
	    <input name="password" id="password" autocomplete="off" type="text"  οnfοcus="this.type='password'"/>
	</div>
    </div>
    
    <div class="submit"> 
        <span>
             <button class="input-button" id="login" type="button">登录</button>
        </span> 
     </div>
</form>

js验证并登录：

$("#login").click(function(event){
			event.preventDefault();
			if( $('#form_login').valid()){
				//首先校验账号和密码是否为空
				var user_name = $("#user_name").val();
				var password = $("#password").val();
				
				var data = {'user_name':user_name,'password':password,'captcha':captcha};
				//其次校验验证码
				$.ajax({
					type:'post',
					url:"{:url('Login/loginCheck')}",
					data:data,
					dataType:'json',
					async:false,
					success:function(data){
						if(data.result === 'true'){
							window.location.href="{:url('Index/index')}"; 
						}else{
							$("#user_name").val('');
							$("#password").val('');
						}
					}
				});
			}
			return false;
		});

最终效果：

09网络欢迎您，想知道09网络是干啥的吗？不妨进来看看进来瞧瞧吧！！    09网络