H5音乐播放器我的2.0

阳光的午后,听着自己播放器传出的音乐,写着一些文字,这是一种享受。今天总结一下自己的播放器2.0相比以前1.0()的一些改进和不足。项目演示地址:

新增加的功能:

a)歌曲分类

b)当前列表,当前歌曲提醒

c)同步歌词

d)横向界面拖拽,提升了界面的友好度

不足的地方:

a)歌词是直接采用了酷我音乐盒自动生成的音乐歌词文件。需要对其里面的内容进行歌词,歌曲时间的预处理。歌词为一个数组,歌曲时间为一个数组,,目前的源字符串分离用了spilt();这样的做法有一定的局限性,并不能适应所有歌词,(目前的做法只能处理”[00:01.56]我心中的……[00:05.90]春天……”这种格式的字符串);如果有”[00:11.56][4:1.05]”等等这样的格式,那么就意味着歌词提取出现偏差甚至错误。

在编写过程中遇到的问题以及解决对策:

a)问题:用js新添加的音乐列表添加click方法没有响应、

原因:由于js初始化的时候就已经获取页面上的元素,如果给js输出的节点添加事件,那么现在的这个触发对象,还是页面初始化时的对象,并不是当前对象。

对策:jquery中的delegate(),为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数,使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)

b)问题:歌词同步出现闪烁,时间不统一

原因:音乐播放的时间和时间数组的单位不统一,在setInterval()中,不断的便利数组,以及与当前时间进行匹配,

对策:目前的做法是把两者的时间都转化成了秒。

在人生的大海中,我们虽然不能把握风的大小,却可以调整帆的方向。

H5音乐播放器我的2.0

相关文章:

你感兴趣的文章:

标签云: