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. Eclipse equinox implementation of OSGi

    Bundle package org.osgi.framework; public interface Bundle extends Comparable<Bundle> { int UN ...

  2. ezdpl Linux自动化部署实战

    最近把ezdpl在生产环境中实施了,再加上这段时间的一些修改,一并介绍一下. 再次申明: ezdpl不是开箱即用的,需要根据自己的应用环境定制.对初学者来说使用起来反倒困难更多.风险更大. 它不是一个 ...

  3. 02_Redis数据类型(String、Hash)

    [Redis数据类型] redis是通过key-Value来存储的,其支持的数据类型如下: 1.字符串 2.Hash 3.List 4.Set 5.SortSet(zset) 注:redis中,命令( ...

  4. 关于Linux系统使用遇到的问题-1:vi 打开只读(readonly)文件如何退出保存?

    问题来源如下: 打开/etc/crontab文件,命令如下: yule@yule-ubuntu:~$ vi /etc/crontab  显示如下内容: # /etc/crontab: system-w ...

  5. Android自定义之流式布局

    流式布局,好处就是父类布局可以自动的判断子孩子是不是需要换行,什么时候需要换行,可以做到网页版的标签的效果.今天就是简单的做了自定义的流式布局. 具体效果: 原理: 其实很简单,Measure  La ...

  6. Unity Android 真机调试

    官方文档 https://docs.unity3d.com/Manual/AttachingMonoDevelopDebuggerToAnAndroidDevice.html 然而 按照官方文档 很多 ...

  7. Markdown 使用方法总结

    标题: [#]  表示一级标题 [##] 表示二级标题 [###]表示三级标题 引用块:在引用文本前插入 Tab,具体几个 Tab 根据文本所处的位置不同而不同 列表:[ - ]即一个空格加上一个中划 ...

  8. [C#]委托和事件(转载)

    原文地址:http://blog.csdn.net/dingxiaowei2013/article/details/20249163 引言 委托 和 事件在 .Net Framework中的应用非常广 ...

  9. 媒体查询,screen and 和only screen and有什么不同

    最佳答案: 彩屏设备 和 (最小宽度768px) 和 (最大宽度959px) 仅限 彩屏设备 和 (最小宽度480px) 和 (最大宽度767px) 在你发的代码中其实没有什么不同,用起来效果都是一样 ...

  10. 使用Cloud application Studio在C4C UI里创建下拉列表(dropdown list)

    在Cloud Application Studio里新建一个Code List Data Type: 维护Value和描述信息,以及在ABSL里使用的constant值. 保存之后,上述维护的信息会存 ...