网站在一些浏览器中工作，但不是全部。

why would my website work on my phone but not on my computer i tried all IE chrome Fire fox and i cant seem to download an image from div but when i use my phone it works fine (chome only). what is happening? here is my website https://torcdesign.com/mom can someone help me find a solution for it to work in all browsers

为什么我的网站会在我的手机上工作，而不是在我的电脑上，我试了所有的IE浏览器，我似乎无法从div下载一个图片，但是当我使用手机时，它的效果很好(只有chome)。发生了什么?这里是我的网站https://torcdesign.com/mom，有人帮我找到一个解决方案，让它在所有的浏览器中工作。

var download = document.getElementById("download"),
		result = document.getElementById("result");

function renderContent() {
    html2canvas(document.getElementById("content"), {
        allowTaint: true
    }).then(function(canvas) {
    		result.appendChild(canvas);
        download.style.display = "inline"; download.href = result.children[0].toDataURL();
    });
}

function downloadImage() {
		
}

document.getElementById("button").onclick = renderContent;
download.onclick = downloadImage

#content {
    position: absolute;
    width: 300px;
    height: 200px;
    border: 5px solid red;
    overflow: hidden;
}

#img1 {
    width: 300px;
    height: 200px;
    position: absolute;
    z-index: 5;
}

#img2 {
    position: absolute;
    z-index: 6;

    width: 150px;
    height: 190px;
}

#img3 {
    position: absolute;
    z-index: 7;
    width: 200px;
    height: 100px;
}

#download {
    display: none;
}

<script src="https://rawgit.com/niklasvh/html2canvas/master/dist/html2canvas.min.js"></script>

<div id="content">
    <img id="img1" src="https://torcdesign.com/shirts/brown.jpg">
    <img id="img2" src="https://torcdesign.com/shirts/kiwi.jpg">
    <img id="img3" src="https://torcdesign.com/shirts/lswhite.jpg">   
</div>
<br><br><br><br><br><br><br><br><br><br><br><br>
<input id="button" type="button" value="convert div to image"><br>
<h3>result:</h3>
<div id="result"></div>
<a id="download" download="my_image.png" href="#">Download image</a>

1 个解决方案

#1

I think you may have to update most of your browsers. According to this reference the download attribute of the a tag is supported by different versions of different browsers.

我认为你可能需要更新大多数浏览器。根据此引用，标签的下载属性由不同版本的不同浏览器支持。