以编程方式点击 <a>-tag 在 Firefox 中不起作用 [英] Programmatical click on <a>-tag not working in Firefox

问题描述

我对 jquery 的 click() 函数有问题.我用 document.createElement('a') 创建了一个 <a>-element 并想调用 click()-function 关于这个元素.关于这个元素，我想创建一个 Excel 文件并将其保存在桌面上.

I have a problem with the click()-function from jquery. I create a <a>-element with document.createElement('a') and want call the click()-function about this element. About this element, I want to create an Excel-file and save this at the desktop.

我的代码:

$('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();
});

此功能在 chrome 下有效，但在 Firefox 下无效.

This function work under chrome, but not under Firefox.

工作示例

有人知道为什么这不起作用吗?

Does anyone have any idea why that does not work?

推荐答案

在 Firefox 中，您可以显式地将创建的元素添加到 DOM 中，它会起作用:

In Firefox, you can explicitly add the created element to the DOM and it will work:

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

小提琴

这篇关于以编程方式点击 <a>-tag 在 Firefox 中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！