最近开发中碰到一个关于表单问题,在用户提交表单时候浏览器会提示是否保存帐号

如果点击保存,在退出帐号切换其他帐号时,浏览器会自动为表单填充数据,为了解决这个自动填充问题时,

主要分2个思路来解决,一个是在极速模式(google内核)下,浏览器会给包含有type为password的表单填充,

解决办法是加载页面时把password改成text,获取焦点时再变成password,就可以解决了

二是在兼容模式(IE内核)下,上一个方法就不行了,IE填充规则是在前一个是text,后一个是password的组合下才会自动填充

解决办法是在中间插入一个空ipunt关让其隐藏

以下贴上代码

@extends('layouts.myuser')
@section('content') <div class="login-bg">
<div class="main">
<div class="login">
<div class="title"><span>{{trans('login.login_no_post')}} </span>
@if ($errors->has('loginError')) <i class="iconfontBusy "></i><span class="errorInfo">{{ $errors->first('loginError') }} </span>@endif
</div>
{{Form::open(['id'=>'myformID'])}}
<ul class="form">
<li>
<span class="placeholder">{{trans('login.login_input_mobile')}}</span>
<span class="user"></span>
<span class="valid"></span> {{Form::text('name','',['autocomplete'=>'off','id'=>'name','placeholder'=>''])}} <p class="showError"><label class="error" for="name">{{$errors->has('name') ? $errors->first('name') :''}}</label></p>
</li>
<li>
<span class="placeholder">{{trans('login.login_pwd')}}</span>
<span class="password"></span>
<input style="display: none;">
{{Form::password('password',['autocomplete'=>'off','id'=>'password','placeholder'=>'','onfocus'=>"this.type='password'"])}} <p class="showError"><label class="error" for="password">{{$errors->has('password') ? $errors->first('password') :''}}</label></p>
</li>
<li>
<div class="desc"><a href="{{ route('my_user.register') }}">{{ trans('login.login_register') }}</a> | <a href="{{ route('my_user.user.forgetpwd') }}">{{ trans('login.login_forget_pwd') }}</a></div>
<div class="submit" id="submit" onclick="common.formSubmitEvent()">登录</div>
</li>
</ul>
{{ Form::close() }}
</div>
</div>
</div> @stop
@section('footer_js')
<script type="text/javascript" src='{{$static}}myHome/js/user/user.js?v=2016101301'></script>
@endsection
@push('scripts')
<script type="text/javascript">
document.getElementById('password').type='text';
common.addJqueryCheckMethodEvent('phone');
common.mobileValidEvent();
common.ebterSubmitEvent();
common.addPassEvent('.login :input');
</script>
{{Form::password('password',['autocomplete'=>'off','id'=>'password','placeholder'=>'','onfocus'=>"this.type='password'"])}}

//上面PHP写法用JS写法

<input autocomplete="off" id="password" placeholder="" onfocus="this.type='password'" name="text" type="text" value="">

如何搞定IE+google双内核的360浏览器表单自动回填兼容问题的更多相关文章

  1. 100天搞定机器学习|Day16 通过内核技巧实现SVM

    前情回顾 机器学习100天|Day1数据预处理100天搞定机器学习|Day2简单线性回归分析100天搞定机器学习|Day3多元线性回归100天搞定机器学习|Day4-6 逻辑回归100天搞定机器学习| ...

  2. #-webkit-autofill##google#启用表单自动填充时,如何覆盖黄色背景

    google和opera浏览器的表单自动填充后,输入框均会变成黄色背景,黑色字体.如下图. 这样的话会与网页的整体设计风格不一致,怎样自定义样式,来覆盖黄色背景. 首先来看看是什么导致的,右键查看元素 ...

  3. Python系列教程-详细版 | 图文+代码,快速搞定Python编程(附全套速查表)

    作者:韩信子@ShowMeAI 教程地址:http://showmeai.tech/article-detail/python-tutorial 声明:版权所有,转载请联系平台与作者并注明出处 引言 ...

  4. 区别原生chrome 和以chrome为内核的360浏览器

    function isChrome360() { if( navigator.userAgent.toLowerCase().indexOf('chrome') > -1 ) { var des ...

  5. 100天搞定机器学习|Day21 Beautiful Soup

    前情回顾 机器学习100天|Day1数据预处理 100天搞定机器学习|Day2简单线性回归分析 100天搞定机器学习|Day3多元线性回归 100天搞定机器学习|Day4-6 逻辑回归 100天搞定机 ...

  6. 100天搞定机器学习|Day22 机器为什么能学习?

    前情回顾 机器学习100天|Day1数据预处理 100天搞定机器学习|Day2简单线性回归分析 100天搞定机器学习|Day3多元线性回归 100天搞定机器学习|Day4-6 逻辑回归 100天搞定机 ...

  7. 100天搞定机器学习|Day33-34 随机森林

    前情回顾 机器学习100天|Day1数据预处理 100天搞定机器学习|Day2简单线性回归分析 100天搞定机器学习|Day3多元线性回归 100天搞定机器学习|Day4-6 逻辑回归 100天搞定机 ...

  8. 100天搞定机器学习|Day35 深度学习之神经网络的结构

    100天搞定机器学习|Day1数据预处理 100天搞定机器学习|Day2简单线性回归分析 100天搞定机器学习|Day3多元线性回归 100天搞定机器学习|Day4-6 逻辑回归 100天搞定机器学习 ...

  9. STM32F103C8T6最小板搞定CMSIS-DAP和SWO功能

    转载:http://www.stmcu.org.cn/module/forum/forum.php?mod=viewthread&tid=616081&extra=page%3D&am ...

随机推荐

  1. OS命令注入中的空格

    1.bash 空格可以替换为%20.%09(tab).%2b(+) in url.{IFS} 2.Win shell 空格可以替换为%20.%09(tab).%0b.%0c.%2b(+) in url

  2. float 对整形的取余运算

    取余是针对整形的,但是有时候一些特殊需求,我们需要 float 型对整形取下余数.比如,将角度化到 0- 360 范围内. 今天看到 lua 的实现方式: a % b == a - math.floo ...

  3. linux 7z 命令编译安装

    7zip是一个开源的压缩软件  7z格式是压缩率最高的格式 服务器备份 数据几个g 要是tar压缩下载的话 时间太长  7zip压缩出来体积很小 首先安装 我这是 centos的 直接可以  yum ...

  4. easyui rowStyler属性

    1.项目中示例 { idField : 'id', // 只要创建数据表格 就必须要加 ifField title : title, fit : true, url : top.baseUrl+ 'c ...

  5. Html中自定义鼠标的形状

    Html中自定义鼠标的形状 <html> <head> <title>自定义的鼠标形状</title> <meta http-equiv=&quo ...

  6. UML大战需求分析--阅读笔记01

    本次阅读的书籍是<UML大战需求分析>,看了前两章的内容:1 大话UML,2绞尽脑汁的需求分析.这两章内容关联不大,分开描述. 第一章:大话UML 本章主要概述UML是什么,有什么内容.U ...

  7. github怎么退出组织和删除自己创建的组织

    1. 点击头像,进入settings 2. 点击左侧菜单中的 Organizations 切换到Origanizations后,右侧面板中会出现所有的oragnizations,我这里只有一个,是我自 ...

  8. Parse Fatal Error at line 4 column 43: 已经为元素 "web-app" 指定属性 "xmlns"。

    打开web.xml;最上面的web-app里面,看有没有重复的,重点关注xmlns="http://java.sun.com/xml/ns/javaee" ,如果重复,删去就好~~ ...

  9. 在Android中Intent的概念及应用(一)——显示Intent和隐式Intent

    Intent寻找目标组件的两种方式: 显式Intent:通过指定Intent组件名称来实现的,它一般用在知道目标组件名称的前提下,一般是在相同的应用程序内部实现的. 隐式Intent:通过Intent ...

  10. Template function 函数模板用法

    #include<iostream> using namespace std; const double PI = 3.1415926; template <class T> ...