`
爱像天空
  • 浏览: 205913 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

使用JS清空fileupload 控件值

阅读更多
1.关于如何用脚本修改fileupload控件值的问题,

开发环境vs2005,在上传文件时,需要一个取消的按钮来清空type=file的value,而且这个页面上有多个file控件

这个比较麻烦因为file的值本身是不允许用脚本修改的(安全角度考虑)



方法1).使用脚本把这个file的input移动到一个form中,然后调用reset,如果有多个这样的input当然还要再移出来.这个方法我不会采用,因为对.net开发者

来讲习惯了一个页面就一个form所有控件都在其中.



方法2).这个方法有点投机,就是在脚本中调用
var fileup = document.getElementById(fileid);
fileup.outerHTML = fileup.outerHTML; 这个ie对脚本处理以及展现机制有关

方法3).以上两种方法只能在IE中使用,强力推荐下面这个方法,将fileupload控件放入span标签中,然后重新生成span中的innerHTML,太绝了:这个主要是在解决ff上的问题时考虑到的,其实就是重新生成了一个id相同的file,这里要注意 name一定也要赋值,否则是很难提交给服务器接受的





在平时项目开发中会有上传文件的功能,一般在前端会通过JS来判断上传文件是否属于指定的文件类型,如果不属于就将控件值清空! (当然你也可以不清空)

有一种方法可以很简单的装文件上传组件的值清空,代码如下:

var file=document.getElementById("form1:fileupload");
file.outerHTML=file.outerHTML



为了兼容FireFox我们使用下面的方式来清空fileupload控件的值:

<span id='uploadSpan'>
<input type="file">
</span>
<script language="JavaScript">
var html=document.getElementById('uploadSpan').innerHTML;

function resetFile(){
document.getElementById('uploadSpan').innerHTML=html;
}
</script>
这样就行了,各浏览器都支持的

http://www.cnblogs.com/jhxk/articles/1667803.html
分享到:
评论

相关推荐

    ASP.Net中FileUpLoad控件内容清空

    ### ASP.NET中FileUpload控件内容清空方法详解 在ASP.NET Web开发中,`FileUpload` 控件常被用于实现文件上传功能。但在某些情况下,我们可能需要清空该控件的内容,例如用户取消了文件选择或者上传操作。本文将...

    ASP.Net中FileUpLoad控件

    本文将详细介绍如何使用FileUpload控件,并重点讲解如何清空FileUpload控件的内容以及实现文件类型的检查。 #### 二、FileUpload控件概述 FileUpload控件是ASP.NET提供的用于处理用户上传文件的一个服务器控件。它...

    FileUpload.Hasfile属性值一直为false

    8. **JavaScript禁用**:如果用户的浏览器禁用了JavaScript,`FileUpload`控件可能无法正常工作。确保你的应用也能在JavaScript被禁用的情况下提供合理的用户体验。 9. **编码问题**:在处理POST请求时,编码问题也...

    解析使用JS 清空File控件的路径值

    本文将解析如何在JavaScript中有效地清空File控件的路径值,确保用户可以取消已选择的文件。 方法1:使用Form的reset方法 在某些情况下,可以将File控件放入一个单独的Form元素中,然后在需要清空文件选择时调用...

    JS控制FileUpload的上传文件类型实例代码

    总结:通过上述实例代码,可以学习如何利用JavaScript来控制FileUpload控件的上传文件类型,实现客户端的文件类型过滤。这种方式不仅提高了应用的效率,还增强了用户体验。需要注意的是,虽然客户端验证可以防止大...

    ASP.NET基础控件-教程

     javascript小技巧  DotNet密码加密的技术  用户MD5加密  ASP.net验证码实现  图片水印  防盗链  .NET(C#)连接各类数据库  读取配置文件数据库连接串  正则表达式验证  递归把十进制转换八进制(面试题目) ...

    用HTML控件实现注册与登录页面

    本实验旨在通过实践来熟悉这些控件的使用方法。 一、用户注册页面 在用户注册页面,通常会包含以下HTML控件: 1. 文本框(`&lt;input type="text"&gt;`):用于用户输入个人信息,如姓名、邮箱、密码等。 2. 单选框(`...

    HTML上传控件取消选择

    这段代码首先通过`getElementById`获取到`id`为`fileupload`的文件上传元素,然后使用`select()`方法选中这个元素,使其成为活动状态。接着,`execCommand("delete")`执行删除命令,理论上应该可以清除用户已选择的...

    ASP.Net.技巧收集.pdf

    - **实现方法**: 使用`FileUpload`控件。 #### 37. Asp.NET 中 WebServices 的使用 - **定义**: 在ASP.NET中使用Web Services进行远程服务调用。 - **实现方法**: 创建WebService类并发布服务。 #### 38. Asp.net ...

    ExtAspNet_v2.3.2_dll

    -使用Hidden来显示隐藏ExtAspNet控件,而不是使用Visible属性(Visible目前设置为只读属性)。 -使用Hidden控制Window控件的显示隐藏,Popup已经标记为Obsolete属性。 -Window的实例方法GetCloseReference等以及...

    ajax3个例子详解(asp.net开发)

    在ASP.NET中,我们可以使用UpdatePanel结合FileUpload控件来实现。用户选择文件后,使用AJAX将文件发送到服务器,后台处理文件保存,然后返回上传成功或失败的消息。 ```csharp //后台C#代码 protected void ...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    -使用Hidden来显示隐藏ExtAspNet控件,而不是使用Visible属性(Visible目前设置为只读属性)。 -使用Hidden控制Window控件的显示隐藏,Popup已经标记为Obsolete属性。 -Window的实例方法GetCloseReference等以及...

    upLoadFile.jsp

    上传图片校验图片格式和大小,清空图片输入框控件,提交校验必填项等等均已经验证成功 , 可以直接使用。请放心下载,支持正版(哈哈哈)。

    ASP.NET下向SQLServer2008导入文件实例操作方法

    #### 添加FileUpload控件 在页面`Default.aspx`中添加一个`FileUpload`控件,ID设为`FileUpload1`。此外,还需要添加三个`Button`控件,其ID分别为`fileUp`和`fileLoad`,Text属性分别设置为“上传文件”和“下载...

    php+ajax无刷新上传图片的实现方法

    在JavaScript部分,我们给文件输入控件(`.fileupload`)包裹一个表单,表单的`action`属性指向PHP处理图片上传的脚本,`method`为`post`,`enctype`设置为`multipart/form-data`,这是上传文件所需的格式。...

Global site tag (gtag.js) - Google Analytics