简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
html5 – Bilder, die durch html2canvas, Kontrollkästchen und ausgewählte Elemente generiert wurden, können nicht als Screenshots erstellt werden.
我想大声告诉你
我想大声告诉你 2017-05-16 13:32:24
0
1
1128

Generieren Sie ein Bild über html2canvas und stellen Sie fest, dass das im Kontrollkästchen ausgewählte Element keinen Screenshot erstellt. 

<!DOCTYPE html>
<html>
<head>
    <title>
        html2canvas
    </title>
</head>
<body id="myPage"  onload="createImage()">
    <p style="height: 100px;width: 100px;background-color: blue">
        我是p
        性别:
        <input type="checkbox" name="sex">男
        <input type="checkbox" name="sex">女
    </p>
</body>
<script type="text/javascript" src="html2canvas.js"></script>
<script type="text/javascript">
    function createImage(){
        html2canvas(document.getElementById('myPage'),{
            allowTaint:true,
            height: 500
        }).then(function(canvas) {
           console.log(canvas);
           var aTag = document.createElement("a");
           aTag.innerHTML = "This is a test";
           aTag.setAttribute("style", "position:absolute; top:50%; z-index:999");
           aTag.setAttribute("href", canvas.toDataURL());
           aTag.setAttribute("download", "myPic.png");
           document.body.appendChild(aTag);
        });
    }
</script>
</html>

Seiten- und Produktionsbilder:

我想大声告诉你
我想大声告诉你

Antworte allen(1)
过去多啦不再A梦
过去多啦不再A梦2017-05-16 13:34:24 1 Etage

可以用的，因为你已进入页面就生成图片了，后面的点击就没效果了，可以这么着。

<!DOCTYPE html>
<html>
<head>
<title>
    html2canvas
</title>
</head>
<body id="myPage">
<p style="height: 100px;width: 100px;background-color: blue">
    我是p
    性别:
    <input type="checkbox" onchange="createImage()" name="sex">男
    <input type="checkbox" onchange="createImage()" name="sex">女
</p>

</body>
<script type="text/javascript" src="https://cdn.bootcss.com/html2canvas/0.5.0-beta4/html2canvas.min.js"></script>
<script type="text/javascript">
var aTag = document.createElement("a");
aTag.innerHTML = "This is a test";
aTag.setAttribute("style", "position:absolute; top:50%; z-index:999");
document.body.appendChild(aTag);
function createImage(){
    html2canvas(document.getElementById('myPage'),{
        allowTaint:true,
        height: 500
    }).then(function(canvas) {
       console.log(canvas);
       aTag.setAttribute("href", canvas.toDataURL());
       aTag.setAttribute("download", "myPic.png");   
    });
}
</script>
</html>
Wie +0
Antwort hinzufügen
Beliebte Themen
Mehr>
Populäre Artikel
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！