让用户的input域不缓存输入过的数据

禁用HTML表单缓存

最新推荐文章于 2024-06-19 15:40:00 发布

原创最新推荐文章于 2024-06-19 15:40:00 发布 · 4.7k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#input #javascript #html #action #function #编程

J2EE框架专栏收录该内容

11 篇文章

订阅专栏

本文介绍了一种通过编程手段防止HTML表单缓存的方法。利用文本输入框与隐藏域结合，在提交前将文本框内容复制到隐藏域并清空文本框，以此避免浏览器自动填充之前的输入内容。

HTML表单的input域可以缓存之前输入过的数据，如有很多系统的input域的名字都为username，则在输入内容的时候会缓存之前输入过的数据，如下图（我划了些与公司有关的数据）：

上次我搞个系统的时候，管理员要添加很多用户和数据，而如果每次都缓存出之前的数据实在另人头痛。当然你可以打开IE的属性，然后清除缓存的数据。但我希望通过编程的方式让用户不缓存数据。原理很简单，follow me：
（假设我不希望缓存的表单域名为myUserName）

1. 添加一个表单text的input域，名为myUserName_tmp
2. 添加一个表单隐藏域，名为myUserName，名字为你要提交表单域，写到这里大家应该明白我其实是希望利用hidden域提交数据
2. 表单提交的时候触发一个Javascript方法validate()，把text域的数据赋值给隐藏域，然后清空text域。

代码如下：

<html>
<head>
<script language="javascript">
function validate() {
    form1.myUserName.value = form1.myUserName_tmp.value;
    form1.myUserName_tmp.value="";
    //alert(form1.myUserName.value);
    //alert(form1.myUserName_tmp.value);
    return false;
}
</script>
</head>
<body>
<form name="form1" action="#" method="POST">
<input type="text"   name="myUserName_tmp" value="">
<input type="hidden" name="myUserName" value="">
<input type="submit" onclick="return validate()">
</form>
</body>
</html>