<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. div 居中进行总结

    1.margin:auto ;让元素居中,需要确定元素的宽度,并且需要是块元素 eg: div { width:200px; height:200px; background:#222; margin ...

  2. 韩顺平HTML5教程www.gis520.com

    传智播客.韩顺平.HTML5游戏公开课-坦克大战01.HTML5介绍.HTML5发展.HTML5学习网站推荐.wmv http://dl.vmall.com/c0b7xrkftf 传智播客.韩顺平.H ...

  3. IT人大学生活之“做点正经事”

    最近一直主抓部门的人事招聘工作:很多到手的简历,特别是毕业一年之内的同学的简历上面都会写到:在xxx餐饮公司实习,获得了与人交流的经验:在学生会组织了哪些文体活动:在大四参加了一些与软件开发不相关的一 ...

  4. Address Book(地址薄)

    <?xml version="1.0" encoding="UTF-8"?> <?import javafx.scene.Scene?> ...

  5. 【每天一个Linux命令】19. 创建文件夹目录命令mkdir

    命令用途 mkdir 命令用来创建指定的名称的目录 使用说明 1.  创建目录的用户在当前目录中具有写权限 2. 指定的目录名不能是当前目录中已有的目录. 命令实例 0. 帮助文件 bixiaopen ...

  6. 关于bootstrap--排版（标题、强调、背景、插入符等）

    1. 2.标题:<h1>这是主标题<small>这是副标题,为当前字号65%,灰色(#999)</small></h1>. 3.段落:<p> ...

  7. 基于drools创建自己的关系操作符

    我们知道drools提供了12种关系操作符 但是有些时候这12种操作符依然不能满足我们的业务需求,我们可以扩展自己的操作符,下面是为某一航空公司做项目时扩展了操作符,在这分享下 首先,我们要实现的逻辑 ...

  8. IOS－沙盒机制（一 简述）

    一 IOS沙盒机制       出于安全的目的,应用程序仅仅能将自己的数据和偏好设置写入到几个特定的位置上.当应用程序被安装到设备上时,系统会为其创建一个家文件夹,这个家文件夹就是应用程序的沙盒.所以 ...

  9. Android基于WIFI实现电脑和手机间数据传输的技术方案研究

    Android手机和电脑间基于wifi进行数据传输,从技术上讲,主要有两种方案: 一种是通过ftp协议实现,Android手机作为数据传输过程中的ftp服务器: 一种是通过http协议实现.Andro ...

  10. LDAP禁止匿名访问

    LDAP默认是允许用户匿名访问的,如下图:在使用工具连接时,勾选匿名绑定后,不需要输入UserDN和密码就可能连接到LDAP服务器,但是只能进行read及search操作.不能做任何的修改及删除操作. ...