Блог

Может ли кто-нибудь помочь мне с перезагрузкой просмотренных изображений, когда я нажимаю кнопку «Обзор», она показывает изображения в режиме предварительного просмотра, но когда я снова нажимаю кнопку «Обзор», старые изображения остаются просмотренными вместо удаленных и отображаются только новые. Может ли энион сказать мне, как найти код, который перезагрузит предварительный просмотр изображения? код ниже… Tnx

 lt;scriptgt;  //I added event handler for the file upload control to access the files properties. document.addEventListener("DOMContentLoaded", init, false);  //To save an array of attachments var AttachmentArray = [];  //counter for attachment array var arrCounter = 0;  //to make sure the error message for number of files will be shown only one time. var filesCounterAlertStatus = false;   //un ordered list to keep attachments thumbnails var ul = document.createElement("ul"); ul.className = "thumb-Images"; ul.id = "imgList";  function init() {  //add javascript handlers for the file upload event  document.querySelector("#files")  .addEventListener("change", handleFileSelect, false); }  //the handler for file upload event function handleFileSelect(e) {  //to make sure the user select file/files  if (!e.target.files) return;   //To obtaine a File reference  var files = e.target.files;   // Loop through the FileList and then to render image files as thumbnails.  for (var i = 0, f; (f = files[i]); i  ) {  //instantiate a FileReader object to read its contents into memory  var fileReader = new FileReader();   // Closure to capture the file information and apply validation.  fileReader.onload = (function(readerEvt) {  return function(e) {  //Apply the validation rules for attachments upload  ApplyFileValidationRules(readerEvt);   //Render attachments thumbnails.  RenderThumbnail(e, readerEvt);   //Fill the array of attachment  FillAttachmentArray(e, readerEvt);  };  })(f);   // Read in the image file as a data URL.  // readAsDataURL: The result property will contain the file/blob's data encoded as a data URL.  // More info about Data URI scheme https://en.wikipedia.org/wiki/Data_URI_scheme  fileReader.readAsDataURL(f);  }  document  .getElementById("files")  .addEventListener("change", handleFileSelect, false); }  //To remove attachment once user click on x button jQuery(function($) {  $("div").on("click", ".img-wrap .close", function() {  var id = $(this)  .closest(".img-wrap")  .find("img")  .data("id");   //to remove the deleted item from array  var elementPos = AttachmentArray.map(function(x) {  return x.FileName;  }).indexOf(id);  if (elementPos !== -1) {  AttachmentArray.splice(elementPos, 1);  }   //to remove image tag  $(this)  .parent()  .find("img")  .not()  .remove();   //to remove div tag that contain the image  $(this)  .parent()  .find("div")  .not()  .remove();   //to remove div tag that contain caption name  $(this)  .parent()  .parent()  .find("div")  .not()  .remove();   //to remove li tag  var lis = document.querySelectorAll("#imgList li");  for (var i = 0; (li = lis[i]); i  ) {  if (li.innerHTML == "") {  li.parentNode.removeChild(li);  }  }  }); });  //Apply the validation rules for attachments upload function ApplyFileValidationRules(readerEvt) {  //To check file type according to upload conditions  if (CheckFileType(readerEvt.type) == false) {  alert(  "The file ("    readerEvt.name    ") does not match the upload conditions, You can only upload jpg/png/gif files"  );  e.preventDefault();  return;  }   //To check file Size according to upload conditions  if (CheckFileSize(readerEvt.size) == false) {  alert(  "The file ("    readerEvt.name    ") does not match the upload conditions, The maximum file size for uploads should not exceed 300 KB"  );  e.preventDefault();  return;  }   //To check files count according to upload conditions  if (CheckFilesCount(AttachmentArray) == false) {  if (!filesCounterAlertStatus) {  filesCounterAlertStatus = true;  alert(  "You have added more than 10 files. According to upload conditions you can upload 10 files maximum"  );  }  e.preventDefault();  return;  } }  //To check file type according to upload conditions function CheckFileType(fileType) {  if (fileType == "image/jpeg") {  return true;  } else if (fileType == "image/png") {  return true;  } else if (fileType == "image/gif") {  return true;  } else {  return false;  }  return true; }  //To check file Size according to upload conditions function CheckFileSize(fileSize) {  if (fileSize lt; 3000000) {  return true;  } else {  return false;  }  return true; }  //To check files count according to upload conditions function CheckFilesCount(AttachmentArray) {  //Since AttachmentArray.length return the next available index in the array,  //I have used the loop to get the real length  var len = 0;  for (var i = 0; i lt; AttachmentArray.length; i  ) {  if (AttachmentArray[i] !== undefined) {  len  ;  }  }  //To check the length does not exceed 10 files maximum  if (len gt; 9) {  return false;  } else {  return true;  } }  document.querySelector('#Filelist').addEventListener("change", RenderThumbnail);   //Render attachments thumbnails. function RenderThumbnail(e, readerEvt) {  var li = document.createElement("li");  ul.appendChild(li);  li.innerHTML = [  'lt;div class="img-wrap"gt; lt;span class="close"gt;amp;times;lt;/spangt;'    'lt;img class="thumb" src="',  e.target.result,  '" title="',  escape(readerEvt.name),  '" data-id="',  readerEvt.name,  '"/gt;'   "lt;/divgt;"  ].join("");   var div = document.createElement("div");  div.className = "FileNameCaptionStyle";  li.appendChild(div);  div.innerHTML = [readerEvt.name].join("");  document.getElementById("Filelist").insertBefore(ul, null); }    //Fill the array of attachment function FillAttachmentArray(e, readerEvt) {  AttachmentArray[arrCounter] = {  AttachmentType: 1,  ObjectType: 1,  FileName: readerEvt.name,  FileDescription: "Attachment",  NoteText: "",  MimeType: readerEvt.type,  Content: e.target.result.split("base64,")[1],  FileSizeInBytes: readerEvt.size  };  arrCounter = arrCounter   1; }    lt;/scriptgt;