Programowe kliknięcie na <a> -tag nie działa w przeglądarce Firefox

Question

Mam problem z funkcją click() z jquery. Tworzę wersję <a> -element z document.createElement('a') i chcę wywołać funkcję click() - dotyczącą tego elementu. O tym elemencie chcę utworzyć plik Excel i zapisać go na pulpicie.

Mój kod:

$('body').on('click', '#test', function(event) { 
    var link = document.createElement('a'); 
    link.download = 'test.xls'; 
    link.href = 'data:application/vnd.ms-excel;utf-8,test'; 
    link.click(); 
}); 

Funkcja ta działa pod Chrome, ale nie w Firefoksie.

przykład robocza: http://jsfiddle.net/0hnuw6b4/1/

Czy ktoś ma jakiś pomysł, dlaczego to nie działa?

Answer 1

Możesz użyć jquery do stworzenia elementu. Będzie działać na obu przeglądarek

$(document).on('click', '#test', function (event) { 
    var link = $("<a/>", { 
     "download": "test.xls", 
     "href": "data:application/vnd.ms-excel;utf-8,test" 
    }); 
    $("#test").append(link); 
    link.get(0).click(); 
}); 

Fiddle

Answer 2

W Firefoksie można jawnie dodać utworzony element do DOM i to będzie działać:

$('body').on('click', '#test', function(event) { 
    var link = document.createElement('a'); 
    // Add the element to the DOM 
    document.body.appendChild(link); 
    link.setAttribute("type", "hidden"); // make it hidden if needed 
    link.download = 'test.xls'; 
    link.href = 'data:application/vnd.ms-excel;utf-8,test'; 
    link.click(); 
}); 

Fiddle

Answer 3

Ty nie trzeba dodawać elementu do DOM, nawet w FireFox. Zamień metodę .click() na następujący kod:

link.dispatchEvent(new MouseEvent(`click`, {bubbles: true, cancelable: true, view: window}));