javascript - Adding delete button for each image thumbnail preview -
i want put next each thumbnail little cross able remove them 1 one. able remove image click on have seperate button "x" remove it.
fileinput.addeventlistener("change", function (e) { var filesvar = this.files; showthumbnail(filesvar); }, false); function showthumbnail(files) { var file = files[0] var image = document.createelement("img"); var thumbnail = document.getelementbyid("thumbnail"); image.file = file; image.setattribute('class', 'imgklik5'); 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); } } }); here code in jfiddle
can me out, please?
see example close button:http://jsfiddle.net/kevalbhatt18/r0taz01l/1/
$('div').on('click', '.closediv', function () { $(this).prev().remove(); $(this).remove(); $('#upload-file').val(""); }); and made changes in showthumbnail function
function showthumbnail(files) { var file = files[0] var thumbnail = document.getelementbyid("thumbnail"); var pdiv = document.createelement("div"); var image = document.createelement("img"); var div = document.createelement("div"); pdiv.setattribute('class', 'pdiv'); thumbnail.appendchild(pdiv); image.setattribute('class', 'imgklik5'); pdiv.appendchild(image) div.innerhtml = "x"; div.setattribute('class', 'closediv'); pdiv.appendchild(div)....... ...................
Comments
Post a Comment