Safari blob 下载影响表单提交 - 导致表单帖子被下载而不是在新选项卡中打开
Posted
技术标签:
【中文标题】Safari blob 下载影响表单提交 - 导致表单帖子被下载而不是在新选项卡中打开【英文标题】：Safari blob download affects form submit - results in form post getting downloaded instead of opening in new tab 【发布时间】：2018-04-25 23:20:05 【问题描述】：下载文件选项（使用 blob）与另一个表单提交选项一起出现在单个页面上。如果在提交表单之前选择了下载选项，则会下载表单结果，而不是在新选项卡中打开。
这种情况仅在 Safari 中发生。其余浏览器按预期工作。
Safari 版本 11.0.1 macOS Sierra 版本 10.12.6示例 jsfiddle - https://jsfiddle.net/e8n9982f/
var $button1 = $("#btn-1");
var $button2 = $("#btn-2");
// Save Locally
$button1.on('click', function()
if (typeof(Blob) !== "undefined" && !!new Blob())
var codeToSave = '<!doctype html>' +
'<html lang="en">' +
'<head>' +
'</head>' +
'<body>' +
'<h1>Hello, world!</h1>' +
'</body>' +
'</html>';
var codeBlob = new Blob([codeToSave],
type: "text/html"
);
var codeSaveAsURL = window.URL.createObjectURL(codeBlob);
var fileNameToSaveAs = "temp-file.html";
if (window.navigator && window.navigator.msSaveOrOpenBlob) // For IE, Edge
window.navigator.msSaveOrOpenBlob(codeBlob, fileNameToSaveAs);
else
var downloadLink = document.createElement("a");
downloadLink.download = fileNameToSaveAs;
downloadLink.href = codeSaveAsURL;
downloadLink.style.display = "none";
document.body.appendChild(downloadLink);
downloadLink.click();
document.body.removeChild(downloadLink);
window.URL.revokeObjectURL(codeBlob);
codeSaveAsURL = null;
codeBlob = null;
return false;
);
// Open in JSFiddle
$button2.on('click', function()
var form = document.createElement("form");
form.id = "submitToFiddle";
form.style.display = "none";
form.method = "post";
form.action = "https://jsfiddle.net/api/post/library/pure/";
form.target = "check";
// form.target = "_blank";
var input = document.createElement("textarea");
input.name = "html";
input.innerHTML = '<h1>Fiddle!</h1>';
document.body.appendChild(form);
form.appendChild(input);;
input = document.createElement("input");
input.type = "submit";
form.appendChild(input);
form.submit();
document.body.removeChild(form);
return false;
);
要在 Safari 中重现该问题，请先单击“本地保存”按钮，然后单击“在 JSFiddle 中打开”按钮。
如果先单击“在 JSFiddle 中打开”按钮，然后单击“本地保存”按钮，则它按预期工作。
我找不到任何关于 Safari 为何如此行事的参考。
【问题讨论】：
【参考方案1】：我遇到了同样的问题Clicking a download link in Safari causes all target=_blank links to download when clicked, is there a workaround?
除非我将目标设置为 _self，否则没有解决方法，这很糟糕。 但是我最近更新到 Safari 11.1.1，问题似乎已经解决了
【讨论】：
以上是关于Safari blob 下载影响表单提交 - 导致表单帖子被下载而不是在新选项卡中打开的主要内容，如果未能解决你的问题，请参考以下文章
如何解决FormDatadelete在safari不能用的问题