表单缓存是指当用户在表单输入之后再次回到该表单或者刷新页面的时候,浏览器会直接显示用户之前的输入,即表单缓存下来了。多数情况下这正是我们想要的,但也有些情况我们希望表单能够刷新,特别是根据后台的数据刷新。例如:单选框   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. 安卓 android studio 报错 All flavors must now belong to a named flavor dimension. Learn more at https://d.android.com

    这个问题是Android studio升级到3.0之后,运行的时候会提示gradle要升级到3.5版本才能编译.于是我把我的gradle升级到了 gradle-4.1-milestone-1 版本,是 ...

  2. 【427】Graph 实现 以及 DFS & BFS

    目录: Graph 实现 二维数组实现 Linked List 实现 DFS:深度优先搜索 stack 实现 recursion 实现 BFS:广度优先搜索(queue) 其他应用 非连通图遍历 - ...

  3. Python - Django - ORM 外键操作

    models.py: from django.db import models # 出版社 class Publisher(models.Model): id = models.AutoField(p ...

  4. antd 用 customize-cra 方式引入 sass

    antd 用 customize-cra 方式引入 sass 只需要安装:node-sass 即可

  5. CentOS7使用yum安装RabbitMQ

    转自:https://jingyan.baidu.com/article/456c463b16f3820a583144a1.html 登录名:admin   密码:admin 1. 如果安装后web界 ...

  6. Keras代码超详细讲解LSTM实现细节

    1.首先我们了解一下keras中的Embedding层:from keras.layers.embeddings import Embedding: Embedding参数如下: 输入尺寸:(batc ...

  7. 开发环境下的 Kubernetes 容器网络演进之路

    马蜂窝技术原创文章,更多干货请搜索公众号:mfwtech 使用 Docker+Kubernetes 来简化开发人员的工作流,使应用更加快速地迭代,缩短发布周期,在很多研发团队中已经是常见的做法. 如果 ...

  8. C# 基于Directshow.Net lib库 USB摄像头使用DirectShow.NET获取摄像头视频流

    https://blog.csdn.net/u010118312/article/details/91766787 https://download.csdn.net/download/u010118 ...

  9. 安卓app和苹果app共用一个二维码

    应项目要求,现在安卓app和苹果app共用一个二维码,对外提供下载: <html> <head> <meta http-equiv="Content-Type& ...

  10. ip网络