Home >Web Front-end >JS Tutorial >Pure JS method to implement local image preview_javascript skills

Pure JS method to implement local image preview_javascript skills

WBOY
WBOYOriginal
2016-05-16 15:47:561023browse

The example in this article describes how to implement local image preview using pure JS. Share it with everyone for your reference. The details are as follows:

I just suddenly saw that there are many similar codes on the Internet, but I couldn’t find a suitable one. I wrote one based on what I had written before. The code is relatively concise and refers to a js I wrote before. The method can be separated out and used separately. It is not tested to be too compatible. Basically all native browsers support it (IE, FF, Chrome)

index.html is as follows:

<html>
<head>
<title>Test</title>
<script type="text/javascript" src="js/z.js"></script>
</head>
<body>
<center>
  <img id="img" src="" /><p />
  <input type="file" id="file" />
</center>
<script>
  z.plimg(z.$('file'),z.$('img'),function(file,img,url){
    alert(url);
  });
</script>
</body>
</html>

z.js click heredownload from this site.

I hope this article will be helpful to everyone’s JavaScript programming design.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn