Ajax 成功时强制下载 .mp3 或 .zip 文件

2024-04-28

用户填写电子邮件验证表单(通过 AJAX 提交)后,如果 AJAX 调用响应成功,我想强制在当前浏览器窗口中开始下载。

电子邮件验证表单如下所示:

<form id="form_download_email" method="POST" action="music_email_verification.php">
    <input id="download_email" type="text" tabindex="1" /> <br/>
    <a href="javascript:void(0);" id="download_email_button">
        Download!
    </a>
</form>

单击“download_email_button”后的 js/jquery 如下所示:

$("#download_email_button").click(function() {

    var action = $("#form_download_email").attr('action');
    var form_data = {email: $("#download_email").val()};

    $.ajax({
        type: "POST",
        url: action,
        data: form_data,
        success: function(response){
            if(response == 'success'){    
                window.location.assign('URL to .mp3 or ZIP');
            }
        }
    });
});

输入response=='success'块,目前我发现强制下载文件而不启动弹出窗口(通过window.open - 无论如何都会被Chrome阻止)的唯一解决方案是使用window .location.assign 如上所示。这是通过 JS 强制下载文件的正确方法吗?

但是,使用 window.location.assign 方法我只能下载 1 个文件,如果我尝试将两个 mp3 放入两行,则不起作用。又名:

window.location.assign('http://song1.mp3');
window.location.assign('http://song2.mp3');

我不希望用户在提交表单后必须单击另一个链接才能下载 .mp3/.zip,我想尝试在 JS/jQuery 中完成这一切。

我想到的最后一个方法是在response=='success'上让浏览器单击文档上的两个隐藏标签,这些标签的href 指向mp3。然而,似乎“问题是你不能通过点击触发链接的默认操作”与 jquery,只是 onclick 属性。

我应该用js来做这个吗?如果没有办法做到这一点,我应该尝试像 PHP 这样的东西吗?

任何有关我目前的做法的建议或有关如何下载多个 mp3 文件的建议都会很有帮助!


为每个要下载的 url 创建一个 iframe,并将 iframe 的源设置为文件 url :)

var 
    urls = ['url_1.mp3', 'url_2.mp3', /* ... , */ 'url_N.mp3'],

    doLoad = function(url){
        $("<iframe />")
            .css("display", "none")
            .bind("load", function(e){
                this.src == url && $(this).remove();
            })
            .attr("src", url)
            .appendTo($(document.body));
    };

for( var i=0; i < urls.length; i++ ) {
    doLoad( urls[i] );
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Ajax 成功时强制下载 .mp3 或 .zip 文件 的相关文章

  • 在 d3 中应用转换时出现错误

    我正在尝试对我在 d3 中设计的条形图应用一些过渡效果 这是我的代码 svg selectAll bar data data enter append g attr class bar append rect attr rx barRadi
  • ECMAScript 6 类中的 getter 和 setter 有何用途?

    我对 ECMAScript 6 类中 getter 和 setter 的意义感到困惑 什么目的 下面是我参考的一个例子 class Employee constructor name this name name doWork return
  • Sequelize 关联 - 请改用 Promise 风格

    我正在尝试将 3 张桌子连接在一起Products Suppliers and Categories然后排SupplierID 13 我读过了如何在sequelize中实现多对多关联 https stackoverflow com a 25
  • 按 Enter 键提交消息?

    我正在开发一个基于本教程使用 Meteor 构建的聊天应用程序 http code tutsplus com tutorials real time messaging for meteor with meteor streams net
  • 如何从左向右滑动文本和图像并具有滑动效果[关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 为什么人们将自己的自定义/用户函数添加到 jQuery 对象中? [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 我见过人们将自己的自定义 用户功能添加到jQuery目的 例如 myUserFunc function regular JS code 你为什么
  • 从本地 html/javascript 网站插入 mySQL 数据库

    我正在尝试做什么 我的程序的目的是插入数据local HTML JS网站变成online 非本地 mySQL数据库 到目前为止我尝试过的 我试图用来实现此目的的原始方法是让我的本地网站使用 javascript 通过在线发布数据PHP文件
  • 从流程图中获取数据系列的颜色

    在看到 stackoverflow 用户页面上很酷的新 声誉 选项卡后 我受到启发 开始尝试使用 Flot 图表库 我有一个包含数百个系列的折线图 在任何给定时间 这些系列中只有几个是可见的 我的数据系列分为几个 类别 我根据该类别分配数字
  • es6-module 默认导出导入为未定义

    我不确定我在这里缺少什么 我正在使用 jspm 和 es6 module loader 开发一个项目 我有一个模块定义如下 import hooks from hooks import api from api import tools f
  • 2 个 SVG 路径的交集

    我需要检查两个 SVG Path 元素是否相交 检查边界框与 getBBox 太不准确了 我目前正在做的是迭代两条路径 getTotalLength 然后检查是否有两个点 getPointAtLength 是平等的 下面是一个片段 但正如您
  • 如何从 jquery .load 获取 php 响应

    例如我给出另一个代码 这是我的 some3 php 代码 第一个文件
  • Lodash _.hasIntersection?

    我想知道两个或多个数组是否有共同的项目 但我不在乎这些项目是什么 我知道 lodash 有一个 intersection方法 但我不需要它来遍历每个数组的每个项目 相反 我需要类似的东西 hasIntersection一旦找到第一个常见的出
  • 如何在 Node.js 中打开 Windows-1255 编码文件?

    我有一个 Windows 1255 希伯来语 编码的文件 我希望能够在 Node js 中访问它 我尝试使用打开文件fs readFile 它给了我一个Buffer我无能为力 我尝试将编码设置为Windows 1255 但这没有被识别 我还
  • 使用 jQuery 获取 JSON Facebook Graph API 用户信息

    我正在尝试使用图形 API 来获取有关用户的一些基本信息 无需用户授权 只需获取公共详细信息 我正在尝试使用 jQuery 和 getJSON 来获取数据并解析它 但我很难弄清楚如何访问我想要的键值对 我想要有类似的东西 var fburl
  • 跟踪预防阻止了对 https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js 存储的访问

    大约一年半前 我使用 OfficeJS API 编写了一个 Excel 加载项 它一直工作到大约两周前 Excel 似乎已经进行了更新 现在我可以右键单击任务窗格并查看开发工具 而以前我无法做到这一点 并且必须运行外部 MS Edge 开发
  • 单击 html 中的按钮后如何从 javascript 函数写入文件

    我正在尝试编写真正基本的代码 在 html 文件上按下按钮后 通过 JavaScript 函数在本地写入 txt 文件 这不可能吗 我可以仅使用 javascript 文件写入文件 但在尝试同时使用两者时则不能
  • 如何获取动态生成元素的数据属性

    当从服务器抛出动态内容 通过 AJAX 时 我有以下响应 a Some content a 我已经使用绑定了点击事件live http api jquery com live 问题出在我的点击事件中 我无法 获取数据属性 因此手动附加不适合
  • 使用 jQuery 的 ajax 方法以 blob 形式检索图像

    我最近问了另一个 相关 问题 这导致了这个后续问题 提交数据而不是输入表单的文件 https stackoverflow com questions 17643142 submitting data instead of a file fo
  • 更改 jQuery UI 选项卡的选定选项卡

    这个问题之前已经被问过几次了 但没有一个与我的情况相似 我有 jQuery Tabs 控件 可以通过 ajax 加载我的选项卡 div ul li a href gt Information a li ul div
  • 如何在 JavaScript 中将日期时间微格式转换为本地时间?

    我有一个页面当前正在使用日期时间微格式 http microformats org wiki datetime design pattern显示时间戳 但我只显示我自己的时区的人类可读时间

随机推荐

  • 如何阻止 Firefox 在按住 Ctrl 键的情况下在新选项卡中打开 gridview 标头排序回发链接

    我试图让 ASP Net 中的 gridview 控件根据用户在尝试通过单击列名称进行排序时是否按下 Ctrl 键进行多重排序 问题是 当我使用 Firefox 时 如果我按下 Ctrl 键单击列名称 浏览器会尝试在新选项卡中打开 java
  • 有没有java对象到对象映射的工具? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • SKPaymentTransaction:transactionDate 到底是什么?

    在苹果的文档中transactionDate is 交易添加到 App Store 支付队列的日期 只读 我只是想澄清一下在以下情况下 transactionDate 是什么 在时间 T1 购买了一些东西 交易日期是 T1 在时间 T2 恢
  • 在浮动元素周围放置边框

    假设我有类似以下代码的内容 我想在左右浮动的两个图像之间显示一些文本 img src testImage1 png alt Test Image 1 img src testImage2 png alt Test Image 2 p Tes
  • 如何减少 MediaCodec 视频/avc 解码中的延迟

    我执行了一些简单的计时电影播放器 java https github com google grafika blob master src com android grafika MoviePlayer java in the Grafik
  • Mongoose findOneAndUpdate 如何知道对象是否存在以及是否被修改

    我在用findOneAndUpdate猫鼬的方法 function update one record Model unique constraint new updated values obj Model findOneAndUpdat
  • 如何在 http POST 请求中发送 HTML 代码?

    我正在从 Google Web Toolkit 应用程序向 php 脚本发送 HTTP POST 请求 内容类型现在是 application x www form urlencoded 所以我可以将变量发送到 php 并使用 POST 在
  • 使用斐波那契堆时 Dijkstra 是否更快?

    使用斐波那契堆时 Dijkstra 是否比使用二进制堆更快 我自己做了一些实现斐波那契堆的实验 并在 Dijkstra 中使用它 我还检查了 fibheap 库中现成的斐波那契堆 但没有一个实现能够更快地找到使用以下命令的最短路径 二进制堆
  • 多列多对一

    我有一个遗留数据库和两个表之间一对一的关系 问题是关系使用两列 而不是一列 在 nhibernate 中是否有某种方法可以说 当获取引用的实体时 它在 join 语句中使用了两列 而不是一列 我有一个类似的表结构 任务进度 进度ID Tas
  • 从纬度和经度获取 Windows TimeZoneInfo

    在网络应用程序中 我让人们输入他们的地址 然后我使用Google 的地理编码 API获取他们的纬度和经度 接下来 我想得到他们的Windows 时区名称使用这些坐标 这样我就可以处理夏令时正确通过 NetTimeZoneInfo objec
  • 尝试使用 Redshift SQL 对累积不同实体进行计数

    我正在尝试获取某个时间序列中 Redshift 中不同对象的累积计数 最简单的事情就是使用COUNT DISTINCT myfield OVER ORDER BY timefield DESC ROWS UNBOUNDED PRECEDIN
  • 我怎样才能残酷无情地中止 Java 中的任务?

    我用 Java 编写了一个数独求解器作为作业 目前我正在尝试找出它可能面临的有问题的输入 以使其变得更好 我已经生成了几千个数独网格David Bau 的数独生成器 http davidbau com archives 2006 09 04
  • WEKA 的重采样过滤器 - 如何解释结果

    我目前正在努力解决机器学习问题 而我必须处理大量不平衡的数据集 也就是说 有六个类 1 2 6 不幸的是有例如对于 1 类 有 150 个示例 实例 对于 2 有 90 个实例 对于 3 类 只有 20 个实例 所有其他类都无法 训练 因为
  • 优化 Web 应用程序开发策略

    如今 许多网络应用程序正在使用它们自己无法使用的 API 或代码 并且通常使用效率低下 我想到了一些谷歌地图混搭 对于 php asp 后端 HTML javascript 尤其是现在所有的 AJAX 存在许多潜在的瓶颈 问题 低效率和双重
  • 直接将函数与匿名函数传递给 then Promise 回调

    我试图理解这三个选项之间的区别 then myCallback then myCallback then gt myCallback The myCallback函数不返回任何内容 仅用于其副作用 因此我不需要它将任何内容传递回承诺链 我不
  • Magento:两种基于重量的统一运费

    尝试按如下方式设置我的运费 如果购物车总重量低于 1 公斤 则运费为 3 68 英镑 如果购物车总重量超过 1 公斤 则运费为 6 68 英镑 如果购物车总价超过 100 英镑 则免运费 我设法使用 6 68 英镑的统一费率将所有这些结合在
  • 如何获取带有完整月份名称的完整日期,例如 2015 年 11 月 2 日

    我想将完整月份的日期加载到文本框中 这意味着用户每次想要在文本框中保存日期时都会获得当前日期和时间 他们不会写任何东西 这是我想要的格式 2015 年 11 月 2 日 但没有得到我想要的结果 我得到了这个结果 DD NOV 2015 但这
  • 滚动播放 Html5 视频

    我正在一个 WordPress 网站上工作 下面的代码可以按照我想要的方式工作 只播放一次 最后出现 重播 按钮 我希望它在滚动到 ie 时开始播放 在视口中 我在这里看到了几种不同的方法来实现这一点 但我无法让它们与我当前的代码很好地配合
  • Android 上的查询何时返回 Null?

    我似乎没有找到任何有关查询 插入或任何其他返回 null 的 SQL 方法的信息 但如果发生错误 它就会发生 我只是想知道游标为空是否意味着发生了错误 或者是否意味着没有选择任何行 例如 我不知道应该如何对待它 作为一个错误或可能不时发生的
  • Ajax 成功时强制下载 .mp3 或 .zip 文件

    用户填写电子邮件验证表单 通过 AJAX 提交 后 如果 AJAX 调用响应成功 我想强制在当前浏览器窗口中开始下载 电子邮件验证表单如下所示