我很乐意使用dropzone.js来实现文件上传功能。我创建这样的表单:
<form action="/target-url" id="my-dropzone" class="dropzone"></form>
<script>
// myDropzone is the configuration for the element that has an id attribute
// with the value my-dropzone (or myDropzone)
Dropzone.options.myDropzone = {
init: function() {
this.on("addedfile", function(file) {
// Create the remove button
var removeButton = Dropzone.createElement("<button>Remove file</button>");
// Capture the Dropzone instance as closure.
var _this = this;
// Listen to the click event
removeButton.addEventListener("click", function(e) {
// Make sure the button click doesn't submit the form:
e.preventDefault();
e.stopPropagation();
// Remove the file preview.
_this.removeFile(file);
// If you want to the delete the file on the server as well,
// you can do the AJAX request here.
});
// Add the button to the file preview element.
file.previewElement.appendChild(removeButton);
});
}
};
</script>
我在html文件头中添加了dropzone.js文件。但是,当我在框中拖动文件时,我收到以下错误:
Uncaught ReferenceError: Dropzone is not defined
请任何帮助。
答案 0 :(得分:4)
你使用非常简单的代码 例如
myDropzone.on("addedfile", function(file) {
file.previewElement.addEventListener("click", function() { myDropzone.removeFile(file); });
});