He leído muchas preguntas aquí y he probado algunas cosas, pero ninguna funciona. Lo que quiero es que se descargue una imagen con solo hacer clic en un botón, pero en cambio, la imagen se abre en otra pestaña brevemente antes de cerrarse nuevamente. Idealmente, quiero que la descarga sea automática, pero ahora solo quiero que funcione.
<script type="text/javascript"> document.onclick = function (e) { e = e || window.event; var element = e.target || e.srcElement; if (element.innerHTML == "Image") { //someFunction(element.href); var name = element.nameProp; var address = element.href; saveImageAs1(element.nameProp, element.href); return false; // Prevent default action and stop event propagation } else return true; }; var link = document.createElement('a'); link.href = 'https://cdn.glitch.global/ab1f9eaf-3be9-411b-9fa4-81a39033290e/1650333182176.png?v=1650469623980'; link.download = 'Download.jpg'; document.body.appendChild(link); link.click(); document.body.removeChild(link); function saveImageAs1(name, adress) { if (confirm('CLICK')) { window.win = open(adress); setTimeout('win.document.execCommand("SaveAs")', 100); setTimeout('win.close()', 500); } } </script> <body> <form id="form1" runat="server"> <div> <p> <a href="https://cdn.glitch.global/ab1f9eaf-3be9-411b-9fa4-81a39033290e/1650333182176.png?v=1650469623980" id="abc">Image</a> </p> </div> </form> </body> ^ Este es un código que obtuve de una pregunta mezclada con la solución de alguien a esa pregunta, pero la imagen no se descarga. <html> <header></header> <body> <a id="download_image" href="" download="https://cdn.glitch.global/ab1f9eaf-3be9-411b-9fa4-81a39033290e/1650333182176.png?v=1650469623980">Download 1</a> <a id="download_image" href="" download="https://cdn.glitch.global/ab1f9eaf-3be9-411b-9fa4-81a39033290e/1650333182176.png?v=1650469623980">Download 2</a> </body> </html>esta versión se basa en una respuesta diferente, descarga algo pero las descargas no se pueden abrir ni ver.
Para obtener información de fondo, estoy codificando en glitch, que es un sitio de codificación en línea como repl, en un Chromebook. ¿Es posible que los problemas se deban a lo que estoy usando?
¿Puede intentar poner la URL de la imagen en href y download atributo como este?
<a id="download_image_1" href="https://cdn.glitch.global/ab1f9eaf-3be9-411b-9fa4-81a39033290e/1650333182176.png?v=1650469623980" download>Download 1</a> <a id="download_image_2" href="https://cdn.glitch.global/ab1f9eaf-3be9-411b-9fa4-81a39033290e/1650333182176.png?v=1650469623980" download>Download 2</a>https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-download
Pero tenga en cuenta que, si bien los navegadores modernos admiten la download , Chrome ahora ignora el atributo de download para el contenido de origen cruzado. https://developer.chrome.com/blog/chrome-65-deprecations/#block-cross-origin-a-download