html5 - Gambar yang dijana oleh html2canvas, kotak pilihan dan item pilihan radio tidak boleh di tangkap skrin.

Jana gambar melalui html2canvas, dan dapatkan kotak pilihan item yang dipilih tidak berjaya mengambil tangkapan skrin.

<!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>

Page dan gambar pengeluaran:

我想大声告诉你2714 hari yang lalu1104

<!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>

html5 - Gambar yang dijana oleh html2canvas, kotak pilihan dan item pilihan radio tidak boleh di tangkap skrin.

membalas semua(1)saya akan balas