javascript--清除表单缓存

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

posted @ 2019-04-04 09:41  橱窗外的小孩  阅读(1498)  评论(0编辑  收藏  举报