JavaScript:隐藏字段的真实表单重置

Question

不幸的是，form.reset()函数没有重置表单的隐藏输入。已签入FF3和Chromium。

有没有人知道如何对隐藏字段进行重置？

Answer 1

最简单的方法似乎是显示:没有文本字段而不是隐藏字段。在这种情况下，默认的重置过程是定期的。

Answer 2

不幸的是，这是正确的as per the standard。一个糟糕的技术规范。IE为隐藏字段提供了一个可重置的defaultValue。参见this discussion：在HTML5中(可惜)这不会改变。

(幸运的是，几乎不需要重置表单。作为一项UI功能，它通常不受欢迎。)

由于根本无法获取value属性的原始值，因此必须将其复制到另一个属性中并获取该值。例如：

<form id="f">

<input type="hidden" name="foo" value="bar" class="value=bar"/>

function resetForm() {
    var f= document.getElementById('f');
    f.reset();
    f.elements.foo.value= Element_getClassValue(f.elements.foo, 'value');
}

function Element_getClassValue(el, classname) {
    var prefix= classname+'=';
    var classes= el.className.split(/\s+/);
    for (var i= classes.length; i-->0;)
        if (classes[i].substring(0, prefix.length)===prefix)
            return classes[i].substring(prefix.length);
    return '';
}

走私该值的替代方法可能包括HTML5 data、另一个备用属性(如title )、要从中读取值的紧跟其后的<!-- comment -->、显式的附加JS信息或仅用于保存默认值的附加隐藏字段。

无论采用哪种方法，它都必须弄乱HTML；它不能在文档就绪时由脚本创建，因为到代码执行时，某些浏览器已经用记忆中的值覆盖了字段的值(通过重新加载或按下后退按钮)。

Answer 3

另一个答案，以防有人来这里找。在页面加载后序列化表单，并在以后使用这些值重置隐藏字段：

var serializedForm = $('#myForm').serialize();

然后，要重置表单：

function fullReset(){

    $('#myForm').reset(); // resets everything except hidden fields


    var formFields = decodeURIComponent(serializedForm).split('&'); //split up the serialized form into variable pairs

    //put it into an associative array
    var splitFields = new Array();
    for(i in formFields){
        vals= formFields[i].split('=');
        splitFields[vals[0]] = vals[1];
    }
    $('#myForm').find('input[type=hidden]').each(function(){    
        this.value = splitFields[this.name];
    });

}