表单缓存是指当用户在表单输入之后再次回到该表单或者刷新页面的时候,浏览器会直接显示用户之前的输入,即表单缓存下来了。多数情况下这正是我们想要的,但也有些情况我们希望表单能够刷新,特别是根据后台的数据刷新。例如:单选框   radio属性,当我们点击之后,刷新一下页面,刚才点击的选项并没有清除,而是缓存了下来。原因:表单缓存造成的。

解决办法:

1. 清除页面缓存。HTML header中加入:

<meta http-equiv="pragma"content="no-cache">

<metahttp-equiv="cache-control" content="no-cache">

<meta http-equiv="expires"content="0">

或者

是手动删除缓存,或者是修改浏览器的设置。

弊端是部分浏览器caching不能用了,浏览速度会降低。

2.比较好的方法:在form中加入autocomplete='off'属性,或者在input中加入autocomplete='off'属性,

好处:满足大部分浏览器 ,不产生表单缓存

3.在页面退出的时候刷新一下表单的内容,比如:

<script type="text/javascript"charset="utf-8">

$(window).unload(function() {

$('select').each(function(){

var othis = $(this);

var oselect =othis.closest('select');

oselect.prepend(othis);

});

});

</script>

4. 在windows环境下的IE更麻烦些,刷新表单内容是没有用的,我试过改变value和改变属性,都不行。唯一的方法是删除表单内容,但这样会使页面变得奇怪,后来想到可以先复制表单内容,然后再删除原有的内容。

$(window).bind('beforeunload', function(e){

$('select').each(function(){

var othis = $(this);

othis.clone().insertbefore(othis);

othis.remove();

});

注意:浏览器需要enable cache才能看到3,4的效果
----------------------------------------------------------------------------------

原文:https://blog.csdn.net/g893465244/article/details/43967647

javascript--清除表单缓存的更多相关文章

  1. 项目总结15:JavaScript模拟表单提交(实现window.location.href-POST提交数据效果)

    JavaScript模拟表单提交(实现window.location.href-POST提交数据效果) 前沿 1-在具体项目开发中,用window.location.href方法下载文件,因windo ...

  2. vue 新增时清除表单验证注意事项

    // 清除表单校验的提示 if (this.$refs['XXX']) { // 延时执行 this.$nextTick(function () { this.$refs['XXX'].clearVa ...

  3. 第一百五十九节,封装库--JavaScript,表单序列化结合ajax提交数据

    封装库--JavaScript,表单序列化结合ajax提交数据 封装库,表单序列化方法 /** xu_lie_biao_dan()方法,表单序列化方法,将自动获取指定表单里面的各项字段name值和va ...

  4. 第一百五十四节,封装库--JavaScript,表单验证--提交验证

    封装库--JavaScript,表单验证--提交验证 将表单的所有必填项,做一个判断函数,填写正确时返回布尔值 最后在提交时,判断每一项是否正确,全部正确才可以 提交 html <div id= ...

  5. 第一百五十三节,封装库--JavaScript,表单验证--备注字数验证

    封装库--JavaScript,表单验证--备注字数验证 效果图 html <div id="reg"> <h2 class="tuo"> ...

  6. 第一百五十二节,封装库--JavaScript,表单验证--年月日注入

    封装库--JavaScript,表单验证--年月日注入 效果图 html <div id="reg"> <h2 class="tuo"> ...

  7. 第一百五十一节,封装库--JavaScript,表单验证--密码确认验证--回答验证--电子邮件验证加自动补全

    封装库--JavaScript,表单验证--密码确认验证--回答验证--电子邮件验证加自动补全 效果图 html <div id="reg"> <h2 class ...

  8. 第一百五十节,封装库--JavaScript,表单验证--密码验证

    封装库--JavaScript,表单验证--密码验证 效果图 html <div id="reg"> <h2 class="tuo">& ...

  9. 第一百四十九节,封装库--JavaScript,表单验证--验证用户名

    封装库--JavaScript,表单验证--验证用户名 注册验证功能,顾名思义就是验证表单中每个字段的合法性,如果全部合法才可以提交表单. 效果图 聚集光标时 信息不合法是 信息合法时 html &l ...

随机推荐

  1. 利用OpenGL固定流水线绘制球体

    在OS X上的一个OpenGL简单demo.所附赠的代码是绘制半个球体.开启了深度缓存和多重采样,采样数是4. 详细下载地址请见:http://www.cocoachina.com/bbs/read. ...

  2. Tekla 导出ifc并浏览

    Tekla导出IFC

  3. 使用java 执行ping命令

    借助 Runtime.getRuntime().exec() 可以运行一个windows的exe程序如图,使用java运行 ping 192.168.2.106,返回这样的字符串   1 2 3 4 ...

  4. 教孩子学编程 Python

    教孩子学编程   Python 目录 第1 章 Python 基础:认识环境 111 认识Python 312 用Python 编写程序 513 运行Python 程序 514 本章小结 615 编程 ...

  5. BladeX部署说明(win7)

    一:安装jdk-8u221-windows-x64 二:安装Nacos,解压nacos-server-1.0.0,运行bin目录下的startup.cmd,成功可以用浏览器访问:localhost:8 ...

  6. C# log4net 配置及使用详解--日志保存到文件和Access(转)

    按语: 最近项目要求选用Access数据库,但日志管理采用log4net,但保存到数据库一直没有成功,后按照如下配置在程序退出时可以成功保存. 开始新建文件应用log4net.dll  ,重新编译就报 ...

  7. 【转】百万年薪挖了p8,难道是水货?

    大厦新搬进来一家创业公司,老板红光满面地提着果篮上楼拜访,说是刚拿到了投资人的钱,正准备扩充团队大干一场.那个时候的他踌躇满志,顾盼生辉.当时我想,能在这个大环境下拿到投资的公司,做的产品应该是有前景 ...

  8. 微信小程序中的事件绑定

    前言: 微信小程序中的事件绑定和Vue中的事件绑定其实有很多的相似之处,所以如果有过Vue相关的经验,学起来的话还是比较容易的. js代码: // 页面级的js文件必须调用Page函数来注册页面, / ...

  9. spring添加事物

    <context:component-scan base-package="com.zlkj" > <context:include-filter type=&q ...

  10. 034 Android NavigationView和DrawerLayout实现抽屉式导航设计(侧边栏效果)

    1.创建带侧滑效果的activity 右击,new---->activity---->选择NavgationDrawer Activity 2.xml文件布局 (1)activity_ma ...