ajaxFileUpload上传onchange只触发一次



在使用ajaxFileUpload控件上传的时候发现一个问题,上传图片只能更换一次,如果再次change,没有反应F6a思考者日记网-束洋洋个人博客

<div style="float: left;">
<img src="#" alt="活动图片" id="licensePic" style="max-width: 450px" class="img-thumbnail" /><br />
<input type="file" id="licenseUrl" name="upload" style="display:none;" />
<input type="hidden" id="uploadLicensePic" />
<a href="#basicInfo" id="uploadlicense" class="btn btn-info">点击上传图片</a>
</div>

 F6a思考者日记网-束洋洋个人博客

页面使用了自定义的上传界面F6a思考者日记网-束洋洋个人博客

使用了一个隐藏的input file类型,一个用于可以点击的按钮,一个展示图片的Img标签,一个存值的input hidden。当点击按钮的时候触发input file点击用于选择图片,将值存在隐藏的input中。F6a思考者日记网-束洋洋个人博客

当重新选择的时候监听input file 改变事件(change),将值重新赋值。F6a思考者日记网-束洋洋个人博客

但是只能更改一次,再次点击上传的时候发现不起作用?F6a思考者日记网-束洋洋个人博客

看下效果:F6a思考者日记网-束洋洋个人博客

 F6a思考者日记网-束洋洋个人博客

看下ajaxFileUpload.js的源码发现F6a思考者日记网-束洋洋个人博客

var newElement = $(oldElement).clone();F6a思考者日记网-束洋洋个人博客

这句,查阅文档F6a思考者日记网-束洋洋个人博客

$(selector).clone(includeEvents);F6a思考者日记网-束洋洋个人博客

includeEvents: 可选。布尔值。规定是否复制元素的所有事件处理。默认地,副本中不包含事件处理器。F6a思考者日记网-束洋洋个人博客

也就是,clone出来的元素,默认是不会有任何事件的!!!F6a思考者日记网-束洋洋个人博客

更改clone(true);问题解决!F6a思考者日记网-束洋洋个人博客

F6a思考者日记网-束洋洋个人博客

 F6a思考者日记网-束洋洋个人博客

 

(转载本站文章请注明作者和出处 思考者日记网|束洋洋个人博客 ,请勿用于任何商业用途)

『访问 思考者日记网404页面 寻找遗失儿童』

告知
  •     本站90%以上文章均属原创,部分转载已加上原作者出处。 如需转载本站文章请您务必保留本站出处!
  •     打广告评论者请自重,请为广大网友提供一个健康干净的网络空间。
  • 感谢主机屋提供网站空间;
  • 感谢万网阿里云提供域名解析;
  • 感谢EmpireCMS提供CMS系统;
  • 感谢bootstrap展示本站前端页面;
  • 感谢Glyphicons Halflings提供字体;
  • 感谢大家一直以来对本站的喜爱,感谢大家!
近期文章 建议与反馈