当前分类:记录>>正文

隐藏【input type=”file”】文件读入框并用图片显示

来源:互联网   更新时间:2022年6月15日  

不得不承认写静态页面是件很累人的事,尤其在没有美工给制作psd效果图的时候。

今天在做一个下载用的单页,给的要求是“没什么要求,突出下载就好”,不知道各位写静态页面的朋友看到这句话是什么想法。

上午准备素材,下午写页面,总算搞定。遇到个小问题,就是隐藏[input type=”file”]文件读入框并用图片显示的问题,没做过没有经验,经人指定后,哇,恍然大悟,原来可以这样实现,现在把我的处理方式记录下。

<div style=”display:none;”>

<input type=”file” id=”woxiede”/>

</div>

//*文件读入框外面加个层,用来隐藏这个读入框

<img src=”图片地址”alt=”图片名称”onclick=”woxiede.click()”>

//*点击图片来触发文件读入框的click()事件,记住与”input”里面的”id“保持一致。

经测试,ie6\7\8,火狐都没有问题,谷歌好像点击后没有反应。这个也是可以理解的,因为正常情况下,谷歌浏览器里的文件读入框就不存在只显示文字,所以如果需要做谷歌浏览器上面的,则判断一下浏览器再选择是否这样写就好了。

不过,我看到QQ空间里面的发布说说插入图片这块倒是用的flash来做的。

累呀,困呀。被太阳晒的!办公室我坐的位子太好了!

本文固定链接:https://6yhj.com/leku-p-24.html  版权所有,转载请保留本地址!
[猜你喜欢]

标签: