发布于 2017-02-02 13:07:23 | 158 次阅读 | 评论: 0 | 来源: 网友投递

这里有新鲜出炉的Javascript教程,程序狗速度看过来!

JavaScript客户端脚本语言

Javascript 是一种由Netscape的LiveScript发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。


这篇文章主要介绍了JS上传图片前实现图片预览效果的方法,涉及javascript操作图片的技巧,需要的朋友可以参考下

本文实例讲述了JS上传图片前实现图片预览效果的方法。分享给大家供大家参考。具体实现方法如下:

<!doctype html public "-//w3c//dtd html 4.01//en" "http://www.w3.org/tr/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>JS上传图片前的图片预览效果</title>

</head>

<body>

<input id="myfile" type="file" />

<br />

<img src="/images/logo.gif" alt="Image to be upload." />

<div id="info"></div>

<script type="text/javascript">

var dFile = document.getElementById('myfile');

var dImg = document.getElementsByTagName('img')[0];

var dInfo = document.getElementById('info');

dFile.onchange = function(){

 if(!dFile.value.match(/.jpg|.gif|.png|.bmp/i)){alert('File type must be: .jpg, .gif, .bmp or .png !');return;}

 if(dFile.files){

  dImg.src = dFile.files[0].getAsDataURL();

 }else if(dFile.value.indexOf('\\') > -1 || dFile.value.indexOf('\/') > -1){

  dImg.src = dFile.value;

 }

}

</script>

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。



最新网友评论  共有(0)条评论 发布评论 返回顶部

Copyright © 2007-2017 PHPERZ.COM All Rights Reserved   冀ICP备14009818号  版权声明  广告服务