<script src="dropzone.js"></script>
<form action="data.php" method="post">
<div class="row-fluid">
<div class="span4" style="text-align: center;">
<div id="my-dropzone">
<img id="imgNoPhoto" src="/img/no-photo.jpg"/>
</div>
<a id="openDropZone" href="#" class="btn btn-inverse" style="margin-top: 10px;">
<img src="" class="icon-plus icon-white">照片上傳
</a>
</div>
</div>
<button type="submit">上交</button>
</form>
<script>
var myDropzone = new Dropzone("div#my-dropzone", {
url: "./data.php",
enqueueForUpload: true,
clickable: '#openDropZone',
thumbnailWidth: 200,
thumbnailHeight: 200,
previewTemplate: "<div class=\"dz-preview dz-file-preview\">\n <div class=\"dz-details\">\n <div class=\"dz-filename\" style=\"display: none;\"><span data-dz-name></span></div>\n <div class=\"dz-size\" style=\"display: none;\" data-dz-size></div>\n <img data-dz-thumbnail />\n </div>\n <div class=\"dz-progress\"><span class=\"dz-upload\" data-dz-uploadprogress></span></div>\n <div class=\"dz-error-message\"><span data-dz-errormessage></span></div>\n</div>"
});
myDropzone.on("selectedfiles", function(files) {
myDropzone.removeAllFiles();
});
myDropzone.on("addedfile", function(file) {
$('#imgNoPhoto').hide(); // hide the default no-imge img
});
$('#btnRegister').click(function(){
$('#apply-form').submit();
return false;
});
</script>
<script src="jquery.js"></script>
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。