1

我有一个具有特定输入文本的表单。他们都有自己的重置值..例如...

<input type="text" 
       name="<?php echo $row['FieldName'];?>"
       id="<?php echo $row['FieldName'];?>" 
       class="required" 
       style="font:12px Verdana ; width:250px;" 
       value="<?php echo $row2[$nameROW]?>" />
<?php }

因此，当我使用正常的 RESET 功能时..它不会清除我的表格。因为它的重置值已经被设置...

那么我怎样才能完全清除不重置表格？

4

4 回答 4

1

这是一个易于使用（纯 js）的函数，您可以使用它通过 id 或名称重置任何表单：

// License: WTFPL
function clearForm(id)
{
    // find form by its id or name
    var form = document.getElementById(id) || document[id] || id;

    // cycle through elements
    for (var i = 0, item; item = form.elements[i]; ++i) {
        switch (item.type) {
            case 'select-one':
                item.selectedIndex = 0;
                break;

            case 'select-multiple':
                for (var j = 0, option; option = item.options[j]; ++j) {
                    option.selected = false;
                }
                break;

            case 'checkbox':
            case 'radio':
                item.checked = false;
                break;

            default:
                item.value = '';
        }
    }​​​​​​
}

调用它：

clearForm('id or name of your form');
于 2012-05-17T04:51:51.823 回答
1

如果您想避免字段被重置为其初始值，您需要实际循环遍历所有输入字段、文本字段和选择元素，将它们的值单独设置为空字符串，将选中的属性设置为 false 等。

您可以在 http://www.electrictoolbox.com/javascript-clear-form/ 上查看在线示例，或者在http://www.electrictoolbox.com/javascript-clear-form/上查看jQuery 解决方案（更简洁）的外观：/ /www.electrictoolbox.com/jquery-clear-form/。

于 2012-05-17T03:39:45.460 回答
0

乔纳森是正确的，但它是不完整的。这是完整的解决方案：

for ( i = 0; i < document.myForm.elements.length; i++ )
  document.myForm.elements[i].fieldName.value = "";

如果您需要进一步的帮助，请告诉我们。这将遍历表单中的每个项目，然后将它们清空。如果您需要更多帮助，请告诉我们。

于 2012-05-17T03:47:34.027 回答
0

使用以下 jQuery 将指定字段设置为空白：

$("#btn_reset").click(function(){
     $("input:text[id=xxx]").val("");
});

使用以下 jQuery 将所有字段值设置为空白：

$("#btn_reset").click(function(){
    $(":input").val("");
});

在上述示例中，#btn_reset 是重置按钮的 ID。您还需要将上述脚本放在您页面的正常 $(document).ready() 函数处理程序中的脚本标记内。当然，以上要求您首先在页面顶部包含 jQuery 库。如果您有任何问题，请告诉我。

以下是完整的 HTML 文件：

<HTML>
    <HEAD>
        <TITLE></TITLE>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>
    <script type="text/javascript" language="javascript">
        $(document).ready(function() {
            $("#btn_reset").click(function() {
                $("input:text[id=xxx]").val("");
            });
        });
    </script>
    </HEAD>
    <BODY>
        <form>
            <input type="text" name="xxx" id="xxx" value="default"  />
            <input type="button" value="Reset" id="btn_reset" />
        </form>
    </BODY>
</HTML>

请注意，您需要将按钮类型从重置更改为按钮，否则在 jQuery 设置值之后，重置按钮行为将再次将值设置为我们不想要的默认值。

于 2012-05-17T03:48:25.310 回答