提交下载文件而不是在浏览器中打开

Question

目前它在同一个选项卡中打开，想要下载而不是打开。

<form onsubmit="this.action = document.getElementById('selectedfile').value">
    <select id="selectedfile">
         <option value="/downloads/file1.pdf">File 1</option>
         <option value="/downloads/file2.pdf">File 2</option>
         <option value="/downloads/file3.pdf">File 3</option>
    </select>
    <input type="submit" value="Download" class="grey-btn" class="color:#ffffff, backgroud-color:#ff0000;" />
</form>

Answer 1

我不确定这只能用 javascript 来完成。 您需要以不同的方式从您的服务器提供文件。

你使用的是PHP还是什么？

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Disposition

您可以发送一个内容处置标头来强制下载而不是打开。

更新：

好的，所以我找到了一种在不弄乱服务器的情况下执行此操作的hacky方法。 a标签有一个可选的download属性，您可以创建并触发点击。 然后你可以删除链接。 这是示例代码：

        const form = document.getElementById('form');
        form.addEventListener('submit', function(e) {
            e.preventDefault();
            const selectedValue = document.getElementById('selectedfile').value;
            console.log(selectedValue)
            const link = document.createElement('a');
            link.setAttribute('download', selectedValue);
            link.href = selectedValue;
            document.body.appendChild(link);
            link.click();
        });

您当然会从您拥有的当前表单中删除 onsubmit 并添加一个 id（示例是 #form）。

Answer 2

我相当确定它是仅针对 pdf 文件的浏览器特定设置，因为现代网络浏览器内置了 pdf 阅读器。 您可以为自己的浏览器更改此设置，但不能为访问您网页的任何客户端更改。

这是有关如何执行此操作的链接：

• 铬合金

• 苹果浏览器

• 火狐

如果您的浏览器不在此处，则只需搜索“如何禁用[在此处插入浏览器] 的内置 PDF 查看器”。