html的input[type="file"]的change方法只起一次作用的解决办法

上传文件的js通常写法:

document.getElementById(‘#upload‘).onchange = function () {
    // do something
};

这样会产生一个问题:选择一个文件之后,再次选择一个文件将不会触发onchange事件(即使是不同的文件也不会)。

解决方法:使用jQuery的live方法

$(‘#upload‘).live(‘change‘, function () {
    // do something
});
时间: 2024-10-13 16:18:48

html的input[type="file"]的change方法只起一次作用的解决办法的相关文章

INPUT[type=file]的change事件不触发问题

在网页上要操作文件通常会使用INPUT[type=file]控件,但这个控件的设计很蛋疼.它不像其它编程语言中文件选择后会触发一个事件,只是让上面的文字改变,而这个改变可能会触发change事件而已.对于文字没改变的选择,change事件则不会触发. 当INPUT[type=file]控件上已经选择过一次文件之后,再次点击它选择同一个文件时change事件就不会触发.因为第二次选择后里面的文字和第一次是一样的,没有改变.还有个更蛋疼情况是有些浏览器会自动记住控件上的文字,即使页面关闭后重新打开还

手机QQ浏览器和微信内置webview对input type="file" 的change事件不灵

做一个H5页面,选中图片后上传,遇到手机QQ浏览器时   不能及时识别change事件,真是日了狗了,下面是针对这一现象的解决办法,不用change事件: <!DOCTYPE> <html>     <head>         <title></title>         <meta charset="utf-8"/>         <meta Content-Type="applicatio

谷歌游览器对&lt;input type=&#39;file&#39;&gt; change只能响应1次解决和样式的改变

在项目过程中遇到的需要上传本地文件,file的原始控件不太美观,但是这个控件和button有点不太一样, 改变这个样式的思路就是在控件外面套一层链接,然后把file控件的透明度设置为0(透明).样式只需要对外面那层进行操作就行. html代码: <td style="text-align: left;"> <a href="javascript:;" class="file">选择文件 <input type=&qu

&lt;input type=&quot;file&quot;&gt; change事件异常处理办法

问题:最近发现一个奇怪的bug, 那就是在上传图片需要采用input type=file来进行文件选择.由于为了适应美工的UI图,所以是把选择文件的input框隐藏了.然后通过另外一个按钮的点击事件来触发input的选择事件.代码如下: <div style="width:120px;height:120px"> <img src="/image/uploadfile.png" style="width:100%;height:100%&

修改input type=file 标签默认样式的简单方法

<html><head><title></title></head><body><form id="uploadForm"  action="" method="post" enctype="multipart/form-data"><input type="file" name="uploadFile&qu

input type file 获得用户选择的一般方法

<script type="text/javascript"> function ShowExcelFile() { var tempName = $("#selectOriginFile_CertificationTemplateSelect").val(); if (tempName != null && tempName != "") { window.open("/home/ReadExcelFile

input type=file 选择文件路径获取方法

input file上传按钮选择文件后的value是无法直接获取到的,本文借用js方法获取file选中文件的物理路径和文件名 代码如下: DOM结构: <input type="text" id="textfield" /><br/> <a class="a-upload"> <input type="file" name="file" id="fileF

将html中的&lt;input type=&quot;file&quot; /&gt;(选择文件) 元素隐藏,并通过其它方式触发点击。

file input的默认外观实在不好看,所以我们要搞定它.. 1. 首先,我们把file input放入一个label,并且将这个label显示为一定的宽高,比如显示为(bootstrap)btn的样式; 2. 为此input增加样式,内联或css文件内写都可以:style="left:-9999px;position:absolute;" 3. 在label内增加文本(作为label btn的显示文本),比如下方示例中的span; <label id="realBt

ajaxfileupload.js结合input[type=file]无刷新上传

jQuery插件AjaxFileUpload用来实现ajax文件上传,该插件使用非常简单,接下来写个demo演示怎么用AjaxFileUpload插件实现文件上传. 说明: 语法:$.ajaxFileUpload([options]) options参数说明: 1.url  上传处理程序地址. 2,fileElementId  需要上传的文件域的ID,即<input type="file">的ID. 3,secureuri 是否启用安全提交,默认为false. 4,data