表单中的隐藏域重置

在 DOM 中，表单重置非常简单，使用 <input type=”reset”> 或者 <button type=”reset”> 即可。原生 DOM 也提供了 reset() 方法用于表单重置。

但是在 Firefox/Chrome 浏览器中，如果字段是隐藏域（type=”hidden”）的话，使用 reset 是无法将字段值还原为初始值的。但在 IE6/7/8 中都可以重置。查看这个示例：

<!doctype html><br /> <html><br /> <head><br /> <title>表单中的隐藏域重置</title><br /> <style><br /> html{color:#000;background:#fff}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#000}body{font:12px/1.5 '\9ed1\4f53',arial;padding:2em}h1{font-size:18px}h2{font-size:16px;color:green;padding:1em<br /> 0}ol{margin:10px<br /> 0 10px 2em}ol<br /> li{list-style:decimal;line-height:1.8}th,td{border:1px<br /> solid #ddd;padding:2px<br /> 5px;font-size:12px}th{font-weight:bold;background:#eee}.clearfix:after{content:'\20';display:block;height:0;clear:both}.clearfix{zoom:1}<br /> </style><br /> <meta http-equiv="Content-Type" content="text/html; charset=gbk"><br /> </head><br /> <body><br /> <h1>表单中的隐藏域重置</h1><br /> <form><br /> <h2>表单中的隐藏域重置</h2><br /> <input type="hidden" value="123" id="JS_hidden"><br /> <input type="text" value="text value" id="JS_text"><br /> <button type="button" id="JS_button">获取隐藏域的值，默认为"123"</button><br /> <button type="button" id="JS_write">将隐藏域的值改写为"abc"</button><br /> <button type="reset">重置表单</button><br /> </form><br /> <script><br /> document.getElementById('JS_button').onclick = function(){<br /> alert('隐藏域的值为：' + document.getElementById('JS_hidden').value);<br /> }<br /> document.getElementById('JS_write').onclick = function(){<br /> document.getElementById('JS_hidden').value = 'abc';<br /> alert('隐藏域的值为：' + document.getElementById('JS_hidden').value);<br /> }<br /> </script><br /> </body><br /> </html> <br /><center>如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提示：可修改后代码再运行!

目前想到的一个解决方案是：

热点

表单中的隐藏域重置

由 dawei

您错过了

优化云客服平台的稳定性和响应速度

云客服具备强大的数据分析能力

云客服推动客户服务行业智能化升级

云客服系统提升企业响应速度的秘诀

表单中的隐藏域重置

由 dawei

相关文章

导航界面推荐广告？蔚来回应 不会用车机屏幕展开广告业务

第四届进博会进入布展阶段 首批展品已进入场

他们是数字经济领域的弄潮儿，2021年度数字新浙商榜单发布

您错过了

优化云客服平台的稳定性和响应速度

云客服具备强大的数据分析能力

云客服推动客户服务行业智能化升级

云客服系统提升企业响应速度的秘诀

导航界面推荐广告？蔚来回应不会用车机屏幕展开广告业务

第四届进博会进入布展阶段首批展品已进入场