问题
I have a button in my application which exports the html elements to png file. I did this by using html2canvas.js. It is working fine in Google chrome and Mozilla firefox browsers. But it is not working in Internet Explorer. When i click that button in IE it is just showing the blank page. I have provided the code in the following. Any help is appreciated.
$("#btnPng").click(function () {
$("#divPulledPopUpButtons").hide();
html2canvas($("#pulledPopUp"), {
onrendered: function (canvas) {
var url = canvas.toDataURL();
$("<a>", {
href: url,
download: "CAR.png"
})
.on("click", function () { $(this).remove() })
.appendTo("body")[0].click()
$("#divPulledPopUpButtons").show();
}
})
});
回答1:
I have got the solution for the above issue. It can be resolved by using canvas.msToBlob() function . msToBlob() can be used only for Internet Explorer browser and for other browsers we can go with canvas.toDataURL(). I have provided the code which works fine in Internet Explorer and other broswers.
$("#btnPng").click(function () {
$("#divPulledPopUpButtons").hide();
html2canvas($("#pulledPopUp"), {
onrendered: function (canvas) {
// debugger;
if (canvas.msToBlob) { //for IE
var blob = canvas.msToBlob();
window.navigator.msSaveBlob(blob, 'CAR.png');
}
else {
var url = canvas.toDataURL('image/png', 1.0);// Other broswers except IE
$("<a>", {
href: url,
download: "CAR.png"
})
.on("click", function () { $(this).remove() })
.appendTo("body")[0].click()
}
$("#divPulledPopUpButtons").show();
}
})
});
来源:https://stackoverflow.com/questions/37991846/png-file-not-downloading-in-internet-explorer-when-using-html2canvas-js-in-jquer