1
Привет друзья Я получаю эту ошибку в следующем коде:Uncaught TypeError: Не удается прочитать свойство «addEventListener» нулевых ошибок для загрузки изображений
Uncaught TypeError: Cannot read property 'addEventListener' of null на линии 11
Строка 11 является:
fileDiv.addEventListener("click",function(e){
$(fileInput).show().focus().click().hide();
e.preventDefault();
},false)
Это входной файл:
<input type="file" class="imageUploadBtn" id="upload-image" name="fotograflar[]" multiple="multiple">
В этой ошибке коды в строке 5:
console.log(fileInput);
fileInput.addEventListener("change",function(e){
var files = this.files
showThumbnail(files)
},false)
Что это за ошибка? Кто-нибудь может мне помочь в этом отношении? Я использую этот код для загрузки изображения, но эта ошибка не позволит мне !!
$(document).ready(function()
{
jQuery(function($){
var fileDiv = document.getElementById("upload");
var fileInput = document.getElementById("upload-image");
console.log(fileInput);
fileInput.addEventListener("change",function(e){
var files = this.files
showThumbnail(files)
},false)
fileDiv.addEventListener("click",function(e){
$(fileInput).show().focus().click().hide();
e.preventDefault();
},false)
fileDiv.addEventListener("dragenter",function(e){
e.stopPropagation();
e.preventDefault();
},false);
fileDiv.addEventListener("dragover",function(e){
e.stopPropagation();
e.preventDefault();
},false);
fileDiv.addEventListener("drop",function(e){
e.stopPropagation();
e.preventDefault();
var dt = e.dataTransfer;
var files = dt.files;
showThumbnail(files)
},false);
function showThumbnail(files){
for(var i=0;i<files.length;i++){
var file = files[i]
var imageType = /image.*/
if(!file.type.match(imageType)){
console.log("Not an Image");
continue;
}
var image = document.createElement("img");
// image.classList.add("")
var thumbnail = document.getElementById("thumbnail");
image.file = file;
thumbnail.appendChild(image)
var reader = new FileReader()
reader.onload = (function(aImg){
return function(e){
aImg.src = e.target.result;
};
}(image))
var ret = reader.readAsDataURL(file);
var canvas = document.createElement("canvas");
ctx = canvas.getContext("2d");
image.onload= function(){
ctx.drawImage(image,100,100)
}
}
}
});
});
У вас есть элемент на странице с идентификатором загрузкой? –
Это означает, что 'fileInput' является' null'. Почему вы используете '.addEventListener()' при использовании jQuery? С помощью jQuery вы можете передать * список * имен событий и назначить этот обработчик только одним вызовом функции. – Pointy
@ Alexander id в моем вопросе: 'id =" upload-image "' – innovation