如果页面上要实现一个点击下载的功能,传统做法是使用一个 a 标签,然后将该标签的 href 属性地址指向下载文件在服务端的地址(相对地址或者绝对地址),比如这样:

能这样实现是因为,在浏览器地址栏输入一个文件地址,如果该文件能在浏览器上打开,那么就直接打开,比如 html 文件,jpg文件等;但是如果该文件不能在浏览器上打开,就会变为下载。

但是有时候这样做会显得有点复杂。比如说我在一个移动端页面定义了一个 app 的下载按钮,显然下载地址会根据机器系统(Android 或者 ios)需要判断,这样就要在 javascript 重置 a 标签的 href 属性。我们十分想要一个 download 函数,能够监听任何 dom 元素,然后完成下载操作,而不仅仅是 a 标签,答案是有的,location.href 可以做到。

的确,既然 a 标签打开一个文件能实现下载功能,那么用 location.href 就也能做到了。

if (isIphone) {
  location.href = '..';
} else {
  location.href = '..';
}

这样,html 端就清净多了。

location.href 实现点击下载功能的更多相关文章

  1. h5 扫描二维码打开app和点击下载功能的实现

    window.onload = function () { jumpToapp() } var browser = { isAndroid: function () { return navigato ...

  2. c# 实现点击下载功能

    转自百度知道 private void DownLoad(string strName, string strPath) { string fileName = strName;//客户端保存的文件名 ...

  3. Safari 下用 "location.href = filePath" 实现下载功能的诡异 bug

    Safari 下的一些诡异 bug 我们已经领教一二,比如前文中说的 无痕浏览模式下使用 localStorage 的 API 就会报错.今天我们要讲的是利用 location.href = file ...

  4. LoadRunner测试下载功能点脚本(方法一)

    性能需求:对系统某页面中,点击下载功能做并发测试,以获取在并发下载文件的情况下系统的性能指标. 备注:页面上点击下载时的文件可以是word.excel.pdf等. 问题1:录制完下载的场景后,发现脚本 ...

  5. js 下载文件 window.location.href

    window.location.href ="../../pages2/assessmentplan/exportPointAsessment.do?planId="+planId ...

  6. window.location.href问题,点击,跳转到首页

    onClick="window.location.href='./';" 点击,跳转到首页. location.href=url Js中实现跳转 window.location.h ...

  7. window.location.href下载文件,文件名中文乱码处理

    下载文件方法: window.location.href='http://www.baidu.com/down/downFile.txt?name=资源文件'; 这种情况下载时:文件名资源文件会中文乱 ...

  8. window.location.href = window.location.href 跳转无反应 a 超链接 onclick 点击跳转无反应

    错误写法 , 主要是在 href="#"这里 <a href="#" id="send" onclick="return b ...

  9. 文件一键上传、汉字转拼音、excel文件上传下载功能模块的实现

    ----------------------------------------------------------------------------------------------[版权申明: ...

随机推荐

  1. ThreadLocal源码分析

    1.概述 ThreadLocal,可以理解为线程的局部变量,作用就是为每一个使用该变量的线程都提供一个变量值的副本,每一个线程都可以独立地改变自己的副本,而不会和其它线程的副本冲突. ThreadLo ...

  2. 【转发】网易邮箱前端技术分享之javascript编码规范

    网易邮箱前端技术分享之javascript编码规范 发布日期:2013-11-26 10:06 来源:网易邮箱前端技术中心 作者:网易邮箱 点击:533 网易邮箱是国内最早使用ajax技术的邮箱.早在 ...

  3. 遍历set集合

    1.迭代遍历:Set<String> set = new HashSet<String>();Iterator<String> iterator= set.iter ...

  4. python-1 python基础知识

    python第一课代码笔记 hello world [root@heartbeat-data- python]# vim hello1.py #!/usr/bin/env python print ( ...

  5. linux下mysql开启远程访问权限及防火墙开放3306端口

    默认mysql的用户是没有远程访问的权限的,因此当程序跟数据库不在同一台服务器上时,我们需要开启mysql的远程访问权限. 主流的有两种方法,改表法和授权法. 相对而言,改表法比较容易一点,个人也是比 ...

  6. Linux IPC System V 消息队列

    模型 #include <sys/types.h> #include <sys/ipc.h> #include <sys/msg.h> ftok() //获取key ...

  7. plsql+绿色版oracle连接远程数据库配置及提示缺少msvcr71.dll解决方法

    之前一直用的sqldeveloper连接oracle数据库,这个免费而且也是官方出品,除了体积略大启动略慢外,也没什么不好的.. 一次偶然机会决定试一下plsql,整理一下安装资料,需要本地oracl ...

  8. [麦先生]Laravel框架实现发送短信验证

    今天在做到用户注册和个人中心的安全管理时,我借助实现第三方短信平台在Laravel框架中进行手机验证的设置;  由于我们做的是一个为客户提供医疗咨询和保健品网站,所以对客户个人隐私的保护显得尤为重要, ...

  9. 怎么解决ZBrush保存历史记录太多问题

    经常有用户反映说ZBrush ®保存历史记录太多了,导致文件太大了!模型已经是降低级别保存了,在保存历史记录的时候还是很慢很慢,不知道怎么才能减少ZBrush保存的历史步骤的多少.针对这一问题,小编统 ...

  10. CF687A. NP-Hard Problem[二分图判定]

    A. NP-Hard Problem time limit per test 2 seconds memory limit per test 256 megabytes input standard ...