Question

之前也曾提出过类似的问题（例如calling click event of input doesn't work in Safari），但答案表明该问题的出现是因为（1）Safari不允许display:none输入元素发生点击事件，或者（2 ），点击必须在用户发起的事件之内。但是，以下代码在Chrome中有效-充满测试字符串的文件已下载到用户的本地计算机，在Safari中不起作用（已执行javascript，但未下载任何文件，并且在调试控制台中未报告任何错误），但条件（1）和（2）均不适用。该代码显式设置display: block，并在用户单击事件处理程序中运行。肯定还有其他问题-有什么想法吗？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>test download</title>
</head>
<body>
<a id="saveFile" href="#">Click here</a>
<script>
document.getElementById("saveFile").addEventListener("click", function(e) {
  let json = JSON.stringify({nodes: 1, edges: 2});
  let element = document.createElement('a');
  element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(json));
  element.setAttribute('download', "test.txt");
  element.style.cssText = "display: block; height: 0; visibility: hidden; width: 0;";
  document.body.appendChild(element);
  element.click();
  document.body.removeChild(element);
}, false);
</script>
</body>
</html>

在Safari中无法使用<a>标记调用click事件

0 个答案: