firefox 输入框自动填充问题

select input 刷新页面后自动填充

场景：

  1. 比如选择了一个select值后，马上刷新页面，firefox将自动切换后上一次选中的值，而不是html 中select 的第一个值。
  2. 在input输入框中填写了数据，刷新页面，会默认填充上一次的数据
    解决方法：
    autocomplete="off" <select autocomplete="off"></select> <input type="text" autocomplete="off" />

password 密码域的自动填充

如果一个 <input type="password"> 前面跟着一个 <input type="text"> ， firefox 会自动记录这个表单的帐号和密码， 即使这两个输入框不是帐号与密码的关系。。
解决方法：
<input type="text" name="password" onfocus="this.type='password'">

chrome 同步请求渲染问题

场景：
在一个流程验证中，需要用到ajax请求接口，根据接口返回值再进行下一步操作。
如果用回调的方法， success 回调会进行好几层，而且 可读性 和 代码结构 都不好。
但是用 async:false 可以解决代码结构问题， 但会引起期间的渲染问题。
chrome 会在接口同步期间，停止与其互斥的UI渲染，比如：在这段代码之前让 mask 膜层显示出现，但 页面渲染会失效，
与接口的同步操作互斥，使渲染停止。

$('#mask').show();
for (var i=0; i<len; i++){
    if ( check() ){
        // todo
    }

    // else  todo
}
$('#mask).hide();

function check(){
    var res = false;
    $.ajax({
        url: '',
        async: false,
        success: function(data){
            res = true;
        }
    });
    return res;
}

解决方法：
让接口同步操作不与膜层显示在同一个事件循环中， 而setTimeout() 是在下一个事件循环执行。

$('#mask').show()
setTimeout(function(){
$('#mask').show();
    for (var i=0; i<len; i++){
        if ( check() ){
            // todo
        }

        // else  todo
    }
    $('#mask).hide();
}, 0);

function check(){
    var res = false;
    $.ajax({
        url: '',
        async: false,
        success: function(data){
            res = true;
        }
    });
    return res;
}