Question

我的问题是，第一次触发onclick()时，没有任何反应，但是当第二次点击它时，代码就会被执行。

onclick()应将<div>转换为png图像文件并将其保存到计算机中。

HTML（TableDay函数指的是我编写的函数，它基本上可以更容易地创建表）：

<div id="TableDiv">
<table id="Table">
<tr>
<th>Dag\Uur</th><th>1</th><th>2</th><th>3</th><th>4</th><th>5</th><th>6</th><th>7</th><th>8</th><th>9</th>
</tr>
<?php
TableDay("Maandag",1);
TableDay("Dinsdag",10);
TableDay("Woensdag",19);
TableDay("Donderdag",28);
TableDay("Vrijdag",37);
?>
</table>
</div>
<a id="Image" href="##" onclick="printTable()">Download</a>

（文字是荷兰语）

onclick="printTable()"引用以下Javascript代码：

<script>
var element = $("#TableDiv"); // global variable
var getCanvas; // global variable

function printTable() {
    html2canvas(element, {
    onrendered: function (canvas) {
        getCanvas = canvas;
    }});

    var imgageData = getCanvas.toDataURL("image/png");
    // Now browser starts downloading it instead of just showing it
    var newData = imgageData.replace(/^data:image\/png/, "data:application/octet-stream");
    $("#Image").attr("download", "Rooster.png").attr("href", newData);
}
</script>

究竟发生了什么，如何才能使html代码中的<a>引用只需要点击一次？

javascript - onclick（）需要两次点击才能触发事件

0 个答案: