JS清空上传控件input(type="file")的值的代码第1/2页
发布时间:2023-08-13 07:22:28
google找到这样一个解决方法:
在上传控件中插入了值,就只能通过form的reset功能来清空了,但是form里面其他的值也被reset了。
既然可以使用form的reset清空,那就有办法了:新建一个临时form,然后将需要清空的上传控件移入其中,reset之后,再移回原来所在位置,最后删除创建的临时form。js代码:
var Upload = {
clear: function(id){
var up = (typeof id=="string")?document.getElementById(id):id;
if (typeof up != "object") return null;
var tt = document.createElement("span");
tt.id = "__tt__";
up.parentNode.insertBefore(tt,up);
var tf = document.createElement("form");
tf.appendChild(up);
document.getElementsByTagName("body")[0].appendChild(tf);
tf.reset();
tt.parentNode.insertBefore(up,tt);
tt.parentNode.removeChild(tt);
tt = null;
tf.parentNode.removeChild(tf);
},
clearForm: function(){
var inputs,frm;
if (arguments.length == 0)
{
inputs = document.getElementsByTagName("input");
}else{
frm = (typeof arguments[0] == "string")?document.getElementById(arguments[0]):arguments[0];
if (typeof frm != "object") return null;
inputs = frm.getElementsByTagName("input");
}
var fs=[];
for ( var i=0; i<inputs.length; i++ )
{
if (inputs[i].type == "file") fs[fs.length] = inputs[i];
}
var tf = document.createElement("form");
for ( var i=0; i<fs.length; i++ )
{
var tt = document.createElement("span");
tt.id = "__tt__" + i;
fs[i].parentNode.insertBefore(tt, fs[i]);
tf.appendChild(fs[i]);
}
document.getElementsByTagName("body")[0].appendChild(tf);
tf.reset();
for ( var i=0; i<fs.length; i++)
{
var tt = document.getElementById("__tt__" + i);
tt.parentNode.insertBefore(fs[i],tt);
tt.parentNode.removeChild(tt);
}
tf.parentNode.removeChild(tf);
}
}
view plaincopy to clipboardprint?
var Upload = {
clear: function(id){
var up = (typeof id=="string")?document.getElementById(id):id;
if (typeof up != "object") return null;
var tt = document.createElement("span");
tt.id = "__tt__";
up.parentNode.insertBefore(tt,up);
var tf = document.createElement("form");
tf.appendChild(up);
document.getElementsByTagName("body")[0].appendChild(tf);
tf.reset();
tt.parentNode.insertBefore(up,tt);
tt.parentNode.removeChild(tt);
tt = null;
tf.parentNode.removeChild(tf);
},
clearForm: function(){
var inputs,frm;
if (arguments.length == 0)
{
inputs = document.getElementsByTagName("input");
}else{
frm = (typeof arguments[0] == "string")?document.getElementById(arguments[0]):arguments[0];
if (typeof frm != "object") return null;
inputs = frm.getElementsByTagName("input");
}
var fs=[];
for ( var i=0; i<inputs.length; i++ )
{
if (inputs[i].type == "file") fs[fs.length] = inputs[i];
}
var tf = document.createElement("form");
for ( var i=0; i<fs.length; i++ )
{
var tt = document.createElement("span");
tt.id = "__tt__" + i;
fs[i].parentNode.insertBefore(tt, fs[i]);
tf.appendChild(fs[i]);
}
document.getElementsByTagName("body")[0].appendChild(tf);
tf.reset();
for ( var i=0; i<fs.length; i++)
{
var tt = document.getElementById("__tt__" + i);
tt.parentNode.insertBefore(fs[i],tt);
tt.parentNode.removeChild(tt);
}
tf.parentNode.removeChild(tf);
}
}
这个方法使用示例:
Html代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test</title>
<script type="text/javascript">
<!--引入以上js代码--></script>
</head>
<body>
<form name="testform" method="post">
<input type="file" name="testfile" />
<input type="button" value="clear" onclick="Upload.clear('testfile')" /><br />
<input type="button" value="clearAll" onclick="Upload.clearForm()" /><br />
<input type="submit" value="submit" /><input type="reset" value="reset" />
</form>
</body>
</html>
猜你喜欢
- 前言XPath,全称XML Path Language,即XML路径语言,它是一门在XML文档中查找信息的语言,它最初是用来搜寻XML文档的
- 图像特征-SIFT尺度不变特征变换1.1图像尺度空间在一定的范围内,无论物体是大还是小,人眼都可以分辨出来,然后计算机要具有相同的能力却很难
- pytorch transform数据处理转c++python推理代码转c++ sdk过程遇到pytorch数据处理的转换1.python代
- 我就废话不多说了,还是直接看代码吧!import pandas as pd# 伪造一些数据fake_data = {'subject
- 介绍Addit 是一个Python模块,除了提供标准的字典语法外,Addit 生成的字典的值既可以使用属性来获取,也可以使用属性进行设置。这
- Python 的 Queue 模块中提供了同步的、线程安全的队列类,包括FIFO(先入先出)队列Queue,LIFO(后入先出)队列Lifo
- 1) chocolatappChocolat是最新出现的一款强大的Mac系统文本编辑器,兼具原生的Cocoa及强大的文本编辑功能。Choco
- 下载中间件在每一个scrapy工程中都有一个名为 middlewares.py 的文件,这个就是中间件文件其中下载中间件的类为 XxxDow
- 例如:性别 gender 男 女 保密基本语法:enum(数据值 1,数据值 2...);数据值列表在 255 个以内,使用 1 个字节来存
- PL/SQL单行函数和组函数详解 函数是一种有零个或多个参数并且有一个返回值的程序。在SQL中Oracle内建了一系列函数,这些函数都可被称
- 无法打开用户默认数据库,登录失败,其原因是登录帐户的默认数据库被删除。 解决办
- 发现问题今天在使用ImageTk.photoImage()显示图片时,当把包含该函数放在自定义函数里时,不能正常显示,移到函数为又可正常显示
- 本文实例讲述了Python注释、分支结构、循环结构、伪“选择结构”用法。分享给大家供大家参考,具体如下:注释:python使用#作为行注释符
- image.jsp------------------------------生成随机验证码图片的Jsp页面 代码如下: <
- Python中有两种循环,分别为:for循环和while循环。1. for循环for循环可以用来遍历某一对象(遍历:通俗点说,就是把这个循环
- 什么是POP3、SMTP和MAP?POP3是Post Office Protocol 3的简称,即邮局协议的第三个版本,他是规定怎样将个人计
- 定义一个banner.js文件,代码如下;window.requestAnimationFrame = window.requestAnim
- 算法是计算机科学中一个重要的研究方向,是解决复杂问题的关键。在计算机世界中,算法无处不在。数据库是存储数据和执行大批量计算的场所,在数据库中
- 大致介绍在python爬虫爬取某些网站的验证码的时候可能会遇到验证码识别的问题,现在的验证码大多分为四类:1、计算验证码 &nbs
- 一、为什么难 秒杀系统难做的原因:库存只有一份,所有人会在集中的时间读和写这些数据。例如小米手