如何防止表单重置清除<input type ="text">元素？

Question

如何防止表单重置清除<input type ="text">元素？

RMo*_*sey 5 javascript forms reset internet-explorer-8 internet-explorer-7

如果我在value已设置的页面上放置一个表单控件,则触发包含表单的重置功能会将值返回到加载页面时的原始值.

但是,如果我使用javascript创建表单控件并将其附加到DOM,则表单控件将被删除并在表单重置时变为空白.我该如何防止这种行为？我想给输入一个默认值,因此它将被视为与页面加载时页面上的控件相同的方式.

在以下示例中,单击RESET将清除一个输入(添加脚本的输入),而不清除另一个输入(静态的输入).我想要的是两个输入都保留它们的价值.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:wicket="http://wicket.sourceforge.net/" xml:lang="en" lang="en">
    <head>
    </head>
    <body>
        <form id="container">
            <input type="reset" value="RESET" />
            <input type="text" value="DefaultValue" />
        </form>
        <script type="text/javascript">
        window.onload = function() {
            var input = document.createElement('input');
            input.setAttribute('value', 'DefaultValue2');
            document.getElementById('container').appendChild(input);
        };
        </script>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

虽然我没有在这个简单的测试用例中包含jQuery,但是我的项目使用了jQuery,我很乐意使用jQuery解决方案.

Answer 1

Jos*_*ola 12

表单reset()使用该defaultValue属性,因此您需要做的就是设置...

window.onload = function() { 
  var input = document.createElement('input');
  input.value = input.defaultValue = 'DefaultValue2';
  document.getElementById('container').appendChild(input); 
};

Run Code Online (Sandbox Code Playgroud)

归档时间：	15 年，2 月前
查看次数：	6908 次
最近记录：	15 年，2 月前