javascript实现上传图片前的预览(TX的面试题)


Posted in Javascript onAugust 20, 2007

以前不知道 file 控件也能使用 onchange,导致面试时失去良机。

<script>
function yulan()
{
var fileext=document.form1.UpFile.value.substring(document.form1.UpFile.value.lastIndexOf("."),document.form1.UpFile.value.length)
        fileext=fileext.toLowerCase()

        if ((fileext!='.jpg')&&(fileext!='.gif')&&(fileext!='.jpeg')&&(fileext!='.png')&&(fileext!='.bmp'))
        {
            alert("对不起,系统仅支持标准格式的照片,请您调整格式后重新上传,谢谢 !");
             document.form1.UpFile.focus();
        }
        else
        {
        //alert(''+document.form1.UpFile.value)//把这里改成预览图片的语句
  document.getElementById("preview").innerHTML="<img src='"+document.form1.UpFile.value+"' width=120 style='border:6px double #ccc'>"
        }

}
</script>
<form name="form1" method="POST" enctype="multipart/form-data">
<input type="file" name="UpFile" size="46" onchange="yulan()">
<div id="preview"></div>
</form>

Javascript 相关文章推荐
TBCompressor js代码压缩
Jan 05 Javascript
For循环中分号隔开的3部分的执行顺序探讨
May 27 Javascript
javascript数据结构与算法之检索算法
Apr 04 Javascript
JQuery中Bind()事件用法分析
May 05 Javascript
JavaScript中用getDate()方法返回指定日期的教程
Jun 09 Javascript
学习JavaScript设计模式(接口)
Nov 26 Javascript
JS 组件系列之 bootstrap treegrid 组件封装过程
Apr 28 Javascript
vue-cli配置文件——config篇
Jan 04 Javascript
使用vue如何构建一个自动建站项目
Feb 05 Javascript
mpvue跳转页面及注意事项
Aug 03 Javascript
JS去除字符串最后的逗号实例分析【四种方法】
Jun 20 Javascript
VsCode与Node.js知识点详解
Sep 05 Javascript
fix-ie5.js扩展在IE5下不能使用的几个方法
Aug 20 #Javascript
关于恒等于(===)和非恒等于(!==)
Aug 20 #Javascript
图片格式的JavaScript和CSS速查手册
Aug 20 #Javascript
javascript 一个自定义长度的文本自动换行的函数
Aug 19 #Javascript
js类中获取外部函数名的方法
Aug 19 #Javascript
写了一个layout,拖动条连贯,内容区可为iframe
Aug 19 #Javascript
转自Jquery官方 jQuery1.1.3发布,速度提升800%,体积保持20K
Aug 19 #Javascript
You might like
一个很方便的 XML 类!!原创的噢
2006/10/09 PHP
php实现用于计算执行时间的类实例
2015/04/18 PHP
php判断表是否存在的方法
2015/06/18 PHP
PHP使用curl模拟post上传及接收文件的方法
2016/03/04 PHP
php批量删除操作代码分享
2017/02/26 PHP
Yii2框架可逆加密简单实现方法
2017/08/25 PHP
win10 apache配置虚拟主机后localhost无法使用的解决方法
2018/01/27 PHP
Aster vs KG BO3 第一场2.19
2021/03/10 DOTA
JavaScript window.setTimeout() 的详细用法
2009/11/04 Javascript
js实现网页抽奖实例
2015/08/05 Javascript
Js与Jq获取浏览器和对象值的方法
2016/03/18 Javascript
js定义类的几种方法(推荐)
2016/06/08 Javascript
JS实现随机抽选获奖者
2019/11/07 Javascript
记录微信小程序 height: calc(xx - xx);无效问题
2019/12/30 Javascript
Vue实现背景更换颜色操作
2020/07/17 Javascript
js实现可爱的气泡特效
2020/09/05 Javascript
js+audio实现音乐播放器
2020/09/13 Javascript
[02:47]2018年度DOTA2最佳辅助位选手4号位-完美盛典
2018/12/17 DOTA
更改Ubuntu默认python版本的两种方法python-&gt; Anaconda
2016/12/18 Python
Python批量合并有合并单元格的Excel文件详解
2018/04/05 Python
python3实现爬取淘宝美食代码分享
2018/09/23 Python
深入解析Python小白学习【操作列表】
2019/03/23 Python
python打开文件的方式有哪些
2020/06/29 Python
python 多线程共享全局变量的优劣
2020/09/24 Python
Kathmandu澳洲户外商店:新西兰户外运动品牌
2017/11/12 全球购物
Speedo速比涛德国官方网站:世界领先的泳装品牌
2019/08/26 全球购物
英国DIY和家居装饰领域的主要品牌:Wickes
2019/11/26 全球购物
后勤岗位职责
2013/11/26 职场文书
农民工讨薪标语
2014/06/26 职场文书
教师节标语大全
2014/10/07 职场文书
行政执法队伍作风整顿个人剖析材料
2014/10/11 职场文书
委托书格式范文
2015/01/28 职场文书
2015年大学学生会工作总结
2015/05/13 职场文书
党支部季度考核意见
2015/06/02 职场文书
python 自动化偷懒的四个实用操作
2021/04/11 Python
python字符串拼接.join()和拆分.split()详解
2021/11/23 Python