download a file directly with javascript? [duplicate]

Question

download a file directly with javascript? [duplicate]

Navigation

#1 by (0 votes)

0

Hello, I am trying to get the photo directly when I visit one of my pages with photos. But when I do it does not work. Try many things but it did not work.

Could someone explain to me how I can do to download my photo directly?

The code of my html would be the following:

<!DOCTYPE html>
<html>
<head>

    <script type="text/javascript">
        function insert(){
            var src = document.getElementById("gamediv");
            var img = document.createElement("img");
            img.src = "imagen.png";
            src.appendChild(img);
        }
     </script>
 </head>
<style>
body, html {
    height: 100%;
    margin: 0;
}

.bgimg {
    background-image: url('fondo.jpg');
    height: 100%;
    background-position: center;
    background-size: cover;
    position: relative;
    color: white;
    font-family: "Courier New", Courier, monospace;
    font-size: 25px;
}

#gamediv{
    height: 20%;
}

.topleft {
    position: absolute;
    top: 0;
    left: 16px;
}

.bottomleft {
    position: absolute;
    bottom: 0;
    left: 16px;
}

.middle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

hr {
    margin: auto;
    width: 40%;
}
</style>
<body>

<div class="bgimg">
  <div class="topleft">
    <!--<p>Logo</p>-->
  </div>
  <div class="middle">
    <!--<h1>COMING SOON</h1>
    <hr>
    <p>35 days left</p>-->
  </div>
  <div class="bottomleft">
    <!--<p>Some text</p>-->
  </div>
  <div id="gamediv">
         <script type="text/javascript">
             insert();
         </script>
     </div>
</div>
</body>
</html>

Try php but I opened another window. Try javascript but I do not know how I can do it so that I can download my photo directly.

javascript

asked by Sergio Ramos 23.02.2018 в 14:46

source

1 answer

autologin with form in a web page JAX WS WebServiceClient Problem

score 0 · Answer 1

Well you have a pretty simple solution, you just have to assign each element a class. Example:

<a class="aDescargar" href="http://qnimate.com/wp-content/uploads/2014/03/images2.jpg" ><img src="http://qnimate.com/wp-content/uploads/2014/03/images2.jpg">

<a class="aDescargar" href="http://wac.2f9ad.chicdn.net/802F9AD/u/joyent.wme/public/wme/assets/ec050984-7b81-11e6-96e0-8905cd656caf.jpg?v=30"><img src="http://wac.2f9ad.chicdn.net/802F9AD/u/joyent.wme/public/wme/assets/ec050984-7b81-11e6-96e0-8905cd656caf.jpg?v=30"></a>

As you can see the two elements to contain an image.

The javascript code is very simple.

<script type="text/javascript">

    //Coger todos los elementos que quieres descargar.
    var aElements = document.getElementsByClassName('aDescargar'); 
    //A cada uno de ellos le asignas el atributo download a true.

    for(a of aElements){
        a.download=true;
        //Como tiene el atributo downlaod=true, simplemente haciendo click la imagen se descarga
        a.click();
    }

</script>

Ready now it is already downloaded automatically.

I hope I have helped you!