html

<div class="container">
<form class="parent" autocomplete="off">
<input type="text" class="search" placeholder="搜索" id="sousuo">
<!--<input type="button" name="" id="" class="btn">-->
</form>
</div>

css

* {
margin: ;
padding: ;
}
.parent {
position: relative;
float: right;
} .search {
height: 30px;
border-radius: 30px;
outline: none;
border: none;
border: 1px solid #ccc;
padding-left: 20px;
}

有过表单设计经验的朋友肯定知道,当我们在浏览器中输入表单信息的时候,往往input文本输入框会记录下之前提交表单的信息,以后每次只要双击 input文本输入框就会出现之前输入的文本,这样有时会觉得比较方便,但有时也会暴露用户的隐藏数据,那么如何让input表单输入框不记录输入过信息的方法呢?

方法一: 在不想使用缓存的input中添加 autocomplete="off"

例如

一:<input type="text"  autocomplete="off" />
二:<input type="text  autocomplete="on" />

方法二: 如果整个表单元素都不使用autocomplete功能的话,在 input 所在的form标签中添加 autocomplete="off"

例如

<form action="#" autocomplete="off">
<input type="text" name="test" />
</form>

清除input框的缓存的更多相关文章

  1. 清除input框对浏览器保存的用户名和密码自动填充问题

    清除input框对浏览器保存的用户名和密码自动填充问题: type类型写如下写法,聚焦的时候type类型为“password” <input ng-model="getpwd" ...

  2. html禁止清除input文本输入缓存

    多数浏览器默认会缓存input的值,只有使用ctl+F5强制刷新的才可以清除缓存记录. 如果不想让浏览器缓存input的值,有2种方法: 方法一: 在不想使用缓存的input中添加 autocompl ...

  3. autocomplete 属性 清除input框输入存留历史值,防止下拉历史值显示

    autocomplete 属性规定输入字段是否应该启用自动完成功能. 自动完成允许浏览器预测对字段的输入.当用户在字段开始键入时,浏览器基于之前键入过的值,应该显示出在字段中填写的选项. 注释:aut ...

  4. 类似input框内最右边添加图标,有清空功能

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  5. 通过定时监听input框来实现onkeyup事件-

    问题:因为zepto无法使用onkeyup 事件 解决方法:通过给input框绑定focus 事件,定时的去监听input的值得改变,在鼠标移出input后,清除定时器 <!DOCTYPE ht ...

  6. js清除单选框所选的值

    js清除单选框所选的值 $("input[type='radio']").removeAttr('checked');

  7. Chrome浏览器清除页面js文件缓存的方法

    Chrome浏览器清除页面js文件缓存 Chrome浏览器清除js缓存方法虽然简单,但有些人还是不太会,有些人会去设置里面清除有时候没有用,这里写一下简单步骤,使用一次以后就会了,而且速度更快 1.打 ...

  8. input框的限制(仅数字以及电话号码的限制)

    电话号码限制 <input  type="text"  id="phone" maxlength="11" onkeyup=" ...

  9. input框focus时的美化效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 在Windows 7 上安装 Mapnik

    环境: 1.Windows 7_64位 2.Python 2.7_32位 步骤: 1.下载 Mapnik SDK   http://mapnik.org/download/  我下载的是  Windo ...

  2. C++字符分割

    AfxExtractSubString 表头: <afxwin.h> BOOL AFXAPI AfxExtractSubString ( CString& rString, LPC ...

  3. mongodb 3.4 学习 (六)监控

    mongostat mongotop db.currentOp db.serverStatus() db.stats() db.collection.stats() # 复制集监控 rs.status ...

  4. IOS CoreData的(增删查改)

    (1).CoreDataa>什么是CoreDatab>CoreData增删改查 "什么时候使用COredata 什么时候使用FMDatabases"CoreData 在 ...

  5. [原]Android打包之Ant打包

    Android自动打包流程详细图: 使用Ant打包会简单很多,只要使用以下两个命令就可以搞定: android update project -p . --target android-18 ant ...

  6. jquery.dataTables列中内容居中问题?求解?

    .table > tbody > tr > td {  vertical-align: middle; }

  7. 20165322 2017-2018-2《Java程序设计》课程总结

    20165322 2017-2018-2<Java程序设计>课程总结 每周作业链接汇总 预备作业1:我期望的师生关系 预备作业2:做中学learning by doing个人感想 预备作业 ...

  8. HDU 5536 字典树

    题意:就是公式. 这现场赛O(n^3)能过,觉得太没天理了. 做法:字典树,枚举两个数,然后在字典树上贪心的跑. #include <bits/stdc++.h> using namesp ...

  9. POJ 1423 斯特林

    题意:进制问题 分析: 打表,但是要用不能 long long 型,超内存. n! = log_{10}\sqrt{2{\pi}n}*(\frac{n}e)^n 精度要求 #include <c ...

  10. react开发环境准备

    使用reactjs,我们有两种方式 一种是通过script标签引入reactjs,这是一种比较古老的编码方式了, 如果我们的项目比较大,你会对项目js进行拆分,然后页面就会通过script标签加载很多 ...