promises javascript
I have a problem with promises in javascript. I want to load a image on website and than read a width and height. A the moment code show alerts "1","2","3","4", than I think try to take data (width and height) from image and last put image on site. Can someone help me understand and solve that? ------------------ Html: ------------------ <!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> <title>Page Title</title> <meta name='viewport' content='width=device-width, initial-scale=1'> <script src='obietnice.js'></script> </head> <body> <input type='file' accept='image/*' onchange='start(event)'><br> <img id='output'> </body> </html> -------------------- JS -------------------- let first = (event) => { const input = event.target; const reader = new FileReader(); reader.onload = () => { const dataURL = reader.result; const output = document.getElementById("output"); output.src = dataURL; }; reader.readAsDataURL(input.files[0]); return new Promise((resolve) => setTimeout ( resolve("1") , 3000) )} let second = () => { const output = document.getElementById("output"); console.log(output.width); console.log(output.height); return new Promise((resolve) => setTimeout ( resolve("2") , 1000) )} let theard = () => { return new Promise((resolve) => setTimeout ( resolve("3") , 2000) )} start = (event) => { first(event) .then((response) => { alert(response); return second() }) .then((response) => { alert(response); return theard() }) .then((response) => { alert(response); alert("4") }); }
Often have questions like this?
Learn more efficiently, for free:
