PHP jQuery实现上传图片时预览图片的功能实例

在PHP项目开发中，有时候经常需要做添加图片的功能。添加图片时，一般需要即时预览上传的图片。下面这个例子就是简单的预览上传图片功能，代码如下（分两部分）：

1、HTML代码：

<div class="c-zt-pic">

<img id="preview" src="">

</div>

<div style="margin-bottom: 20px;">

<input type="file" name="image" id="upload" class="btn btn-edc" value="添加图片">

</div>

2、jQuery代码

$(function() {

//预览上传图片

$('#upload').change(function() {

var f = document.getElementById('upload').files[0];

var src = window.URL.createObjectURL(f);

document.getElementById('preview').src = src;

});

});

效果以及注意事项如下：