表单缓存是指当用户在表单输入之后再次回到该表单或者刷新页面的时候,浏览器会直接显示用户之前的输入,即表单缓存下来了。多数情况下这正是我们想要的,但也有些情况我们希望表单能够刷新,特别是根据后台的数据刷新。例如:单选框   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. openresty开发系列17--lua中的正则表达式

    与其他脚本语言不同的是,Lua并不使用POSIX规范的正则表达式[4](也写作regexp)来进行模式匹配.主要的原因出于程序大小方面的考虑:实现一个典型的符合POSIX标准的regexp大概需要40 ...

  2. python接入微博第三方API之1环境准备

    环境准备: 1.注册微博账号 2.注册应用

  3. 线程池+同步io和异步io(浅谈)

    线程池+同步io和异步io(浅谈) 来自于知乎大佬的一个评论 我们的系统代码从同步方式+线程池改成异步化之后压测发现性能提高了一倍,不再有大量的空闲线程,但是CPU的消耗太大,几乎打满,后来改成协程化 ...

  4. C++11使用make_shared的优势和劣势

    Why Make_shared ? C++11 中引入了智能指针, 同时还有一个模板函数 std::make_shared 可以返回一个指定类型的 std::shared_ptr, 那与 std::s ...

  5. 算法习题---5.9数据库(Uva1592)

    一:题目 对数据库中数据进行检测,是否出现数据冗余现象.即是否某一列出现两个及以上数据重复 如上图中,第二列中第2,3行数据重复,所以我们判断为数据冗余.因为他可以分解为下面两张表 (一)样例输入 H ...

  6. 123457123456#0#----com.DoraGame.AiMiYu20--前拼后广--caimi-doraX

    com.DoraGame.AiMiYu20--前拼后广--caimi-doraX

  7. NETTY option参数

    Channel配置参数 (1).通用参数 CONNECT_TIMEOUT_MILLIS :   Netty参数,连接超时毫秒数,默认值30000毫秒即30秒. MAX_MESSAGES_PER_REA ...

  8. 常见浏览器CSS hack方法总结

    ie6和ie7 #tip {*background:black; /*IE7 背景变黑色*/_background:orange; /*IE6 背景变橘色*/} IE8和IE9 :root .test ...

  9. Js获取file上传控件的文件路径总结

    总结一个获取file上传控件文件路径的方法 firefox由于保护机制只有文件名,不能获取完整路径. document.getElementById('file').onchange = functi ...

  10. MySQL的join on和 where 的执行顺序和区别,以及各种连接说明

    目录 1.各种连接的解读说明: 1.1.各种连接的含义和说明 1.1.1 所有连接分类 1.1.2 left join 和 left outer join 区别 1.2.神图参考 1.4.一些参考说明 ...