<html>
<head>
<title>这种方式支持任何浏览器</title>
</head>
<body>
<div id="div1"></div>
<input type="button" value="立即" onclick="play_click(this,'短歌.mp3');">
<div id="div2"></div>
<script language="javascript">
function play_click(sef, url) {
var div = document.getElementById('div1');
div.innerHTML = '<embed src="' + url + '" loop="0" autostart="true" hidden="true"></embed>';
var emb = document.getElementsByTagName('EMBED')[0];
if (emb) {
/* 这里可以写成一个判断 wav 文件是否已加载完毕,以下采用setTimeout模拟一下 */
div = document.getElementById('div2');
div.innerHTML = 'loading: ' + emb.src;
sef.disabled = true;
setTimeout(function () { div.innerHTML = ''; }, 1000);
}
}
</script>
</body>
</html>

js 实现音乐播放的更多相关文章

  1. JS实现音乐播放器

    JS实现音乐播放器  前  言            最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播 ...

  2. 原生JS实现音乐播放器!

      前  言            最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播放的同时支持图片的 ...

  3. HTML+纯JS制作音乐播放器

    该篇文章会教你通过JavaScript制作一个简单的音乐播放器.包括播放.暂停.上一曲和下一曲. 阅读本文章你需要对HTML.CSS和Javascript有基本的了解. 话不多说,先上图. emmm. ...

  4. html5 js控制音乐播放

      <!DOCTYPE HTML><html><head><meta charset="UTF-8"><script lang ...

  5. react.js 实现音乐播放、下一曲、以及删除歌曲(仅播放列表)

    import React, { Component } from 'react'; export default class Music extends Component {   construct ...

  6. 10个免费开源的JS音乐播放器插件

    点这里 音乐播放器在网页设计中有时候会用到,比如一些时尚类.音乐或影视类等项目,但这些 网页播放器 插件比较少见,所以这里为大家整理一个集合,也许会有用到的时候. 下面整理的播放器有些是支持自适应的, ...

  7. 使用 原生js 制作插件 (javaScript音乐播放器)

    1.引用页面 index.html <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

  8. js插件---10个免费开源的JS音乐播放器插件

    js插件---10个免费开源的JS音乐播放器插件 一.总结 一句话总结:各种插件都有很多,多去找. 二.js插件---10个免费开源的JS音乐播放器插件 亲测可用 音乐播放器在网页设计中有时候会用到, ...

  9. 每天看一片代码系列(三):codepen上一个音乐播放器的实现

    今天我们看的是一个使用纯HTML+CSS+JS实现音乐播放器的例子,效果还是很赞的: codePen地址 HTML部分 首先我们要思考一下,一个播放器主要包含哪些元素.首先要有播放的进度信息,还有播放 ...

随机推荐

  1. Linux的标准输出、标准错误输出、nohup

    1.在bash中标准输出可以用1来表示:通常来说这个1可以省略: 如./xxx >/dev/null 和 ./xxx 1>/dev/null 是一个意思 2.在bash中标准错误输出可以用 ...

  2. JAVA中this用法小结[转]

    Java关键字this只能用于方法方法体内.当一个对象创建后,Java虚拟机(JVM)就会给这个对象分配一个引用自身的指针,这个指针的名字就是 this.因此,this只能在类中的非静态方法中使用,静 ...

  3. df 和du 命令统计磁盘空间不准确

    Linux & Unix 中 df 和 du 命令统计磁盘空间数值不一致 经常会使用 df 和 du 分别查看磁盘空闲空间和占用空间,偶尔会发现 df(空闲空间) 会小于磁盘大小减去 du(占 ...

  4. bzoj1047-理想的正方形(二维单调队列)

    题意: 给一个矩阵,给出行列和每个数,再给出一个N,求出所有N*N的子矩阵中最大值最小值之差的最小值解析: 暴力枚举肯定不行,这题可以用二维单调队列做,把同一行的连续N个点缩成一个点保存最大最小值预处 ...

  5. [转] ubuntu 一些常用软件的安装

    首先说明一下 ubuntu 的软件安装大概有几种方式: 1. deb 包的安装方式deb 是 debian 系 Linux 的包管理方式, ubuntu 是属于 debian 系的 Linux 发行版 ...

  6. cobol语言基础培训教程

    COBOL 是Common Business Oriented Language 的缩写.它不仅是商业数据处理的理想语言,而且广泛用于数据管理领域,因此COBOL 语言也被称为”用于管理的语言”. 一 ...

  7. Android开发之DatePickerDialog与TimePickerDialog的功能和使用方法具体解释

    DatePickerDialog与TimePickerDialog的功能比較简单,使用方法也非常easy.仅仅要以下两步就可以. Ø  通过newkeyword创建DatePickerDialog.T ...

  8. UVA 10400 Game Show Math (dfs + 记忆化搜索)

    Problem H Game Show Math Input: standard input Output: standard output Time Limit: 15 seconds A game ...

  9. CentOS6.6(单用户模式)重设root密码

    1.开机时手要快按任意键,因为默认时间5s 2.grub菜单,只有一个内核,没什么好上下选的,按e键.不过如果你升级了系统或安装了Xen虚拟化后,就会有多个显示了. 3.接下来显示如下,选择第二项,按 ...

  10. oracle SQL语句练习MERGE、模糊查询、排序、

    Oracle支持的SQL指令可分为数据操作语言语句.数据定义语言语句.事务控制语句.会话控制语句等几种类型:1.数据操作语言语句数据操作语言语句(Data manipulation language, ...