分别如下:
方法1:遍历页面元素
/*
清空FORM表单内容 id:表单ID*/
function ClearForm(id) {
var objId = document.getElementById(id)
if (objId == undefined) {
return
}
for (var i = 0i <objId.elements.lengthi++) {
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 = 0j <objId.elements[i].options.lengthj++) {
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")
1、在html中的表单form设置属性action='#'防止自动提交 2、利用js获取html中表单form,重新设置表单的action 3、action设置完毕后调用form.submit()方法提交表单 4、表单提交后利用window.close()关闭当前窗口button按钮也可以的啊,一样的使用方法啊,在js中提交的,还是说你想根据不同的按钮将form1表单提交到不同的action里?
<script type="text/javascript">
function sub(){
document.form1.submit()
}
</script>
<body>
<form action="Getvalue" method="post" name="form1">
<input type="text" name="username"><br/>
<input type="password" name="password"><br/>
<input type="button" value="button测试" onclick="sub()">
</form>
</body>
处理的方法有两种,他们是:表单数据一种是get方式, 另一种是post 方式方法如下:
1.get方式
对于get方式,node处理起来非常简单
如以下代码:
var urlParsed = url.parse(request.url)
var getData = querystring.parse(urlParsed.query)
//getData 为object类型 同名表单为array
get返回结果:
{
name: "blue5tar",
hobby:["read", "surfing"]
}
2. post方式
post方式处理起来比较麻烦,但是有了node-formidable 这个module 我们就省事多了
使用npm安装 node-formidable
npm install formidable
formidable 使用方法
formidable = require("formidable")//载入 formidable
var form = new formidable.IncomingForm()
var post = {},
file = {}
form.uploadDir = '/tmp' //文件上传 临时文件存放路径
form
.on('error', function(err) {
console.log(err)//各种错误
})
//POST 普通数据 不包含文件 field 表单name value 表单value
.on('field', function(field, value) {
if (form.type == 'multipart') { //有文件上传时 enctype="multipart/form-data"
if (field in post) { //同名表单 checkbox 返回array 同get处理
if (util.isArray(post[field]) === false) {
post[field] = [post[field]]
}
post[field].push(value)
return
}
}
post[field] = value
})
.on('file', function(field, file) { //上传文件
file[field] = file
})
.on('end', function() {
fn()//解析完毕 做其他work
})
form.parse(request)//解析request对象
post方式有个bug
当form 有enctype=“multipart/form-data” 和没有 enctype=“multipart/form-data” 时 同名表单处理的方式不一样。
有 enctype=“multipart/form-data” 时 同名表单会被最后一个value覆盖,
没有 enctype="multipart/form-data"时,同get一样 会返回一个array
所以, 在 'field’事件时,对form.type进行不同处理 , 同名表单都返回array
还有一个问题,上传文件时 如果不选择文件 也会在临时目录生成空的临时文件, 解决办法:
修改 formidable 模块 lib/incoming_form.js handlePart方法 在183行处添加:
if (part.filename == "") {
return
}
上传文件返回的结构如下:
{
size: 40635, //文件大小
path: '/tmp/f0423db2bf874499423ce409e2f222f4', //临时文件路径
name: 'arrow.png', //文件名称
type: 'image/png', //文件 mime
lastModifiedDate: Sun, 11 Mar 2012 07:19:44 GMT,
_writeStream:
{ path: '/tmp/f0423db2bf874499423ce409e2f222f4',
fd: 7,
writable: false,
flags: 'w',
encoding: 'binary',
mode: 438,
bytesWritten: 40635,
busy: false,
_queue: [],
drainable: true },
length: [Getter], //同size
filename: [Getter], //同name
mime: [Getter] //同type
}
文件上传到临时文件目录下,我们还要将临时文件, 移到我们的上传目录中
fs.rename(file.path, global.appConfig.uploadDir + '/' + file.filename)