用JS怎么清空表单

Posted 2023-03-23

JS清空表单有二种方法：遍历和reset；
分别如下：
方法1：遍历页面元素
/*
清空FORM表单内容 id：表单ID*/
function ClearForm(id)
var objId = document.getElementById(id);
if (objId == undefined)
return;

for (var i = 0; i < objId.elements.length; i++)
if (objId.elements[i].type == "text")
objId.elements[i].value = "";

else if (objId.elements[i].type == "password")
objId.elements[i].value = "";

else if (objId.elements[i].type == "radio")
objId.elements[i].checked = false;

else if (objId.elements[i].type == "checkbox")
objId.elements[i].checked = false;

else if (objId.elements[i].type == "select-one")
objId.elements[i].options[0].selected = true;

else if (objId.elements[i].type == "select-multiple")
for (var j = 0; j < objId.elements[i].options.length; j++)
objId.elements[i].options[j].selected = false;


else if (objId.elements[i].type == "textarea")
objId.elements[i].value = "";

//else if (objId.elements[i].type == "file")
// //objId.elements[i].select();
// //document.selection.clear();
// // for IE, Opera, Safari, Chrome
// var file = objId.elements[i];
// if (file.outerhtml)
// file.outerHTML = file.outerHTML;
// else
// file.value = ""; // FF(包括3.5)
//
//



方法2：使用 reset 按钮
页面中增加：
<!--用来清空表单数据-->

<input type="reset" name="reset" style="display: none;" />

触发 reset 事件：
$("input[type=reset]").trigger("click"); 参考技术A 调用FORM的reset方法可以重置表单,但如果要清空,可以用遍历,也可以对每个表单元素value属性赋空值,但对于SELECT,RADIO,CHECKBOX等控件需要单独处理. 参考技术B 获取文本框的id
document.GetElementById('user').value="";

用js代码清空表单数据

如何在表单提交后，清空保存在表单的数据

两种方式：
一、使用reset类型的按钮
二、使用reset方法
<form name="form1">
<input type="reset" value="重置"/>
<input type="button" value="清除" onclick="form1.reset()"/>
<input type="text" name="text1"/>
<input type="text" name="text2"/>
</form> 参考技术A

用js把文本框清空只需要在input定义中加入clientidmode="Static"，即将<inputtype="text" id="region" runat="server"readonly="readonly" style="border:0px; font-weight:bold;"/>改为<input type="text"id="region" runat="server" clientidmode="Static" readonly="readonly"style="border:0px; font-weight:bold;"/>，这样脚本生成的id为region。

再利用JS清空值，document.getElementById("region").value="";

参考技术B 如果不是想要用reset()手动清空的话那就这样：
提交完之后再跳转到本页面(即刷新本页面)
例asp提交后：response.write("<script>alert('提交成功！');window.location='feedback.asp';</script>")追问

我是用php，提交之后我取出了输入的数据，然后输出到输入框，这样的话提交失败的话，就不用所有的都重新输入了
但是我想在提交成功之后，能清空保存的值

追答

1.如果是对表单输入值的验证判断就用js:
用js做验证，当提交失败的时候就返回 这样文本框里的值仍然保留（除了密码域之外），提交成功就用跳转到提交页来清空！
2.如果是用户输入信息但有些信息错误而返回重新填写 但要求保存已正确的信息在文本框中，则用session()，将这些正确的值保存起来，错误的不保存，表单文本框当然要存储这session()值，提交成功后清空session()

追问

为什么我这样取不到表单的值，document.getElementById("title").value="";

追答

你的文本框上写了 id="title" 这个属性没有，写了id就应该取得到！

本回答被提问者采纳 参考技术C document.form1.reset(); 参考技术D reset();