首頁猿問火狐瀏覽器的a標(biāo)簽無法實(shí)現(xiàn)下載

火狐瀏覽器的a標(biāo)簽無法實(shí)現(xiàn)下載

JavaScript

MYYA 2018-08-26 15:23:25

問題描述想通過a標(biāo)簽實(shí)現(xiàn)canvas的下載，相同的代碼在谷歌瀏覽器下可行，在火狐下卻無法實(shí)現(xiàn)相關(guān)代碼// 請把代碼文本粘貼到下方（請勿用圖片代替代碼）var mycanvas = $("#export11").find("canvas")[0]; var image = mycanvas.toDataURL("image/jpeg"); var $a = document.createElement('a'); $a.setAttribute("href", image); $a.setAttribute("download", this.state.nowDate + "多能點(diǎn)號圖"); $a.click();

查看完整描述

2 回答

斯蒂芬大帝

TA貢獻(xiàn)1827條經(jīng)驗(yàn) 獲得超8個贊

模擬點(diǎn)擊出現(xiàn)的問題，在火狐中直接$a.click()是沒有效果的，有兩種方式可以實(shí)現(xiàn)。
方法一：

var image = mycanvas.toDataURL("image/jpeg");
var $a = document.createElement('a');$a.setAttribute("href", image);$a.setAttribute("download", this.state.nowDate + "多能點(diǎn)號圖.jpg");//需要加上后綴名
document.body.appendChild($a);$a.click();
document.body.removeChild($a);

方法二：

var image = mycanvas.toDataURL("image/jpeg");
var $a = document.createElement('a');$a.setAttribute("href", image);$a.setAttribute("download", this.state.nowDate + "多能點(diǎn)號圖.jpg");//需要加上后綴名
const evt = document.createEvent('Event');
evt.initEvent("click", true, true);$a.dispatchEvent(evt);

反對回復(fù) 2018-08-27

子衿沉夜

TA貢獻(xiàn)1828條經(jīng)驗(yàn) 獲得超3個贊

$a.click() 改成 $a.dispatchEvent(new MouseEvent('click', {bubbles: true, cancelable: true, view: window}));

    var mycanvas = $("#export11").find("canvas")[0];    var image = mycanvas.toDataURL("image/jpeg");    var $a = document.createElement('a');
    $a.setAttribute("href", image);
    $a.setAttribute("download",  "多能點(diǎn)號圖");
    $a.dispatchEvent(new MouseEvent('click', {bubbles: true, cancelable: true, view: window}));

親證可用

反對回復(fù) 2018-08-27