js 实现音乐播放
<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 实现音乐播放的更多相关文章
- JS实现音乐播放器
JS实现音乐播放器 前 言 最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播 ...
- 原生JS实现音乐播放器!
前 言 最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播放的同时支持图片的 ...
- HTML+纯JS制作音乐播放器
该篇文章会教你通过JavaScript制作一个简单的音乐播放器.包括播放.暂停.上一曲和下一曲. 阅读本文章你需要对HTML.CSS和Javascript有基本的了解. 话不多说,先上图. emmm. ...
- html5 js控制音乐播放
<!DOCTYPE HTML><html><head><meta charset="UTF-8"><script lang ...
- react.js 实现音乐播放、下一曲、以及删除歌曲(仅播放列表)
import React, { Component } from 'react'; export default class Music extends Component { construct ...
- 10个免费开源的JS音乐播放器插件
点这里 音乐播放器在网页设计中有时候会用到,比如一些时尚类.音乐或影视类等项目,但这些 网页播放器 插件比较少见,所以这里为大家整理一个集合,也许会有用到的时候. 下面整理的播放器有些是支持自适应的, ...
- 使用 原生js 制作插件 (javaScript音乐播放器)
1.引用页面 index.html <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
- js插件---10个免费开源的JS音乐播放器插件
js插件---10个免费开源的JS音乐播放器插件 一.总结 一句话总结:各种插件都有很多,多去找. 二.js插件---10个免费开源的JS音乐播放器插件 亲测可用 音乐播放器在网页设计中有时候会用到, ...
- 每天看一片代码系列(三):codepen上一个音乐播放器的实现
今天我们看的是一个使用纯HTML+CSS+JS实现音乐播放器的例子,效果还是很赞的: codePen地址 HTML部分 首先我们要思考一下,一个播放器主要包含哪些元素.首先要有播放的进度信息,还有播放 ...
随机推荐
- 【译】typeof null的前世今生
更新时间2013-11-05:为了更好的解释为什么typeof null的结果是object,我看了一下C代码的实现(译者注:Javascript源码). 在Javascript语 ...
- c指针点滴三(指针运算)
#include <stdio.h> #include <stdlib.h> void main3() { ; int *p = # p++;//不可预测的值 ...
- <php>过时方法连接数据库代码
<?php //1.生成链接 $db_connect = mysql_connect("localhost","root","20982239& ...
- 第30讲 UI组件之 GridView组件
第30讲 UI组件之 GridView组件 1.网格布局组件GridView GridView是一个ViewGroup(布局控件),可使用表格的方式显示组件,可滚动的控件.一般用于显示多张图片,比如实 ...
- 第29讲 UI组件之 ListView与 BaseAdapter,SimpleAdapter
第29讲 UI组件之 ListView与 BaseAdapter,SimpleAdapter 1.BaseAdapter BaseAdapter是Android应用程序中经常用到的基础数据适配器,它的 ...
- pyqt搜索指定信息 github处找到,谢谢这位朋友的帮助了
def tabunqi(self,text): #第一遍添加之后,不提示,当第二次添加相同的数据时,就提示下 text1=str(text) items = self.downwid ...
- 小米路由器mini如何设置外网访问wan网站的方法
很多的玩友都在小米路由器mini上面搭建了自己的网站,有些朋友还需要设置对外网进行开放,我自己也在路由器上面实践了使用,下面与大家分享一下如何设置外网访问路由器网站的办法. 工具/原料 小米路由器mi ...
- NetAnalyzer笔记 之 九 使用C#对HTTP数据还原
[创建时间:2016-05-12 00:19:00] NetAnalyzer下载地址 在NetAnalyzer2016中加入了一个HTTP分析功能,很过用户对此都很感兴趣,那么今天写一下具体的实现方式 ...
- 关于C#中的弱引用
本文前部分来自:http://www.cnblogs.com/mokey/archive/2011/11/24/2261605.html 分割线后为作者补充部分. 一:什么是弱引用 了解弱引用之前,先 ...
- QT实现透明效果的按钮
QPushButton { color: rgb(0,88,152) background-color: rgba(97%,80%,9%,50%)}