红叶的专栏
世界很美好,我们要珍惜每一天
博客园
首页
新随笔
联系
订阅
管理
随笔 - 11 文章 - 0 评论 - 14 trackbacks - 0
<
2008年4月
>
日
一
二
三
四
五
六
30
31
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
1
2
3
4
5
6
7
8
9
10
与我联系
发短消息
搜索
常用链接
我的随笔
我的空间
我的短信
我的评论
更多链接
我的参与
我的新闻
最新评论
我的标签
留言簿
给我留言
查看留言
我参加的小组
LumaQQ.NET
web标准设计
设计模式
javascript
创业交流
你必须知道的.NET
ASP.NET
大话设计模式
我的标签
javascript
(10)
HTML
(4)
自定义
(4)
属性
(3)
动态
(3)
Firefox
(3)
IE
(3)
页面
(2)
资源
(2)
nodeValue
(2)
更多
随笔分类
C#、ASP.NET(1)
javascript、Web页面设计开发(11)
随笔档案
2008年4月 (11)
相册
常用图片
收藏夹
ASP.NET技巧(4)
javascript技巧(4)
CSDN
CSDN BLOG
积分与排名
积分 - 3778
排名 - 5946
最新评论
1. re: 用javascript定义和操作自定义HTML元素
解决了 document.getElementById("").options[document.getElementById("").selectedInde...
--serryzhao
2. re: 用javascript定义和操作自定义HTML元素
好像<select>中的自定义不行,有什么解决办法吗?谢谢
--serryzhao
阅读排行榜
1. javascript中验证日期和日期时间格式 (469)
2. 用javascript添加控件自定义属性(392)
3. 纯javascript的HTML在线编辑器(378)
4. 一个javascript写的media player播放器 (340)
5. 用javascript实现既能禁止页面鼠标右键查看 同时又能查看页面文本框右键菜单(306)
评论排行榜
1. javascript中的自定义属性的应用--避免频繁访问数据库(5)
2. 用javascript定义和操作自定义HTML元素(3)
3. 用javascript实现既能禁止页面鼠标右键查看 同时又能查看页面文本框右键菜单(3)
4. ASP.NET页面中window.open方法对history对象的影响及解决(2)
5. 一个javascript写的media player播放器 (1)
一个javascript写的media player播放器
界面较为简单,支持播放列表 。
建立播放列表的步骤为:
1)在文本框中输入媒体资源的地址,可以是HTTP地址,相对地址和绝对地址
2)点击“添加到媒体列表”按钮,将媒体资源信息放到媒体列表中
3)在媒体列表中,点击“添加”链接,将媒体加入到播放列表中
4)重复若干遍,加入所有歌曲
5)点击“播放选中的歌曲“,就开始播放 播放列表中的所有打勾的媒体文件
完整代码如下:
<
script
language
="JavaScript"
>
function
el(objname)
{
return
document.getElementById(objname);
}
//
增加一首歌到播放器列表,这样,播放器放完一首歌之后,会继续放下一首
function
addmedia(url)
{
//
取得当前的播放列表
var
playlist
=
Player.currentPlaylist;
//
新建一个指定URL的Media。
var
currMedia
=
Player.newMedia(url);
//
把新建的Media item添加到播放器列表
playlist.appendItem(currMedia);
}
function
clearlist()
{
//
Player.currentPlaylist.count返回列表中的歌曲数量
while
(Player.currentPlaylist.count
>
0
)
{
var
item
=
Player.currentPlaylist.item(Player.currentPlaylist.count
-
1
);
Player.currentPlaylist.removeItem(item);
//
从播放列表中删除项
}
}
//
清空播放列表
function
clearPlaylist()
{
clearlist();
var
l_tb
=
el(
"
tabPlayList
"
);
var
row_len
=
l_tb.rows.length;
for
(
var
i
=
0
; i
<
row_len; i
++
)
l_tb.firstChild.removeChild(l_tb.firstChild.childNodes[
0
]);
}
//
清空媒体列表
function
clearMedialist()
{
var
l_tb
=
el(
"
tabMediaList
"
);
var
row_len
=
l_tb.rows.length;
for
(
var
i
=
0
; i
<
row_len; i
++
)
l_tb.firstChild.removeChild(l_tb.firstChild.childNodes[
0
]);
}
//
播放选中的歌曲
function
addSeletedSongToPlayList()
{
clearlist();
var
l_tb
=
el(
"
tabPlayList
"
);
var
row_len
=
l_tb.rows.length;
if
(row_len
==
0
)
{
//
alert("无歌曲");
return
;
}
for
(
var
i
=
0
;i
<
row_len;i
++
)
{
var
check
=
l_tb.rows[i].cells[
0
].childNodes[
0
];
var
songname
=
l_tb.rows[i].cells[
1
].innerText;
if
(check.checked
==
true
)
{
addmedia(songname);
}
}
SetPlayMode(el(
"
setplay
"
).options[el(
"
setplay
"
).selectedIndex].value)
Player.controls.play();
//
让播放器开始播放
}
//
添加文本输入框中的url到播放列表
function
addUrlToList()
{
//
addmedia(document.getElementById("songURL").value );
var
l_tb
=
el(
"
tabMediaList
"
);
var
row_len
=
l_tb.rows.length;
var
tr
=
document.createElement(
"
tr
"
);
var
td
=
document.createElement(
"
td
"
);
var
strSong
=
el(
"
songURL
"
).value;
var
strHtml
=
strSong
+
"
<a href='#' onclick='addSong("
"
+
strSong
+
"
");'>添加</a>
"
;
strHtml
+=
"
<a href='#' onclick='removeSong(this.parentElement.parentElement);'>移除</a>
"
;
td.innerHTML
=
strHtml;
tr.appendChild(td);
l_tb.firstChild.appendChild(tr);
el(
"
songURL
"
).value
=
"
http://
"
;
}
//
添加文本输入框中的url到播放列表
function
addSong(strSongName)
{
var
l_tb
=
el(
"
tabPlayList
"
);
var
row_len
=
l_tb.rows.length;
var
tr
=
document.createElement(
"
tr
"
);
var
td
=
document.createElement(
"
td
"
);
var
strChecked
=
"
<input type='checkbox' checked value='
"
+
strSongName
+
"
'>
"
;
td.innerHTML
=
strChecked;
tr.appendChild(td);
td
=
document.createElement(
"
td
"
);
td.innerHTML
=
strSongName;
tr.appendChild(td);
td
=
document.createElement(
"
td
"
);
var
strHtml
=
"
<a href='#' onclick='removePlaySong(this.parentElement.parentElement);'>移除</a>
"
;
td.innerHTML
=
strHtml;
tr.appendChild(td);
l_tb.firstChild.appendChild(tr);
}
//
从媒体列表删除
function
removeSong(tr)
{
var
l_tb
=
el(
"
tabMediaList
"
);
l_tb.firstChild.removeChild(tr);
}
//
从播放列表删除
function
removePlaySong(tr)
{
var
l_tb
=
el(
"
tabPlayList
"
);
l_tb.firstChild.removeChild(tr);
}
//
到指定位置播放
function
playposition()
{
Player.controls.currentPosition
=
parseFloat(el(
"
txtPosition
"
).value);
el(
"
txtPosition
"
).value
=
"
1.0
"
;
}
function
StartMeUp()
{Player.controls.play()}
function
ShutMeDown()
{Player.controls.stop()}
function
Pause()
{Player.controls.pause()}
function
Next()
{Player.controls.next()}
function
Prev()
{Player.controls.previous()}
function
Forward()
{Player.controls.fastForward()}
function
reverse()
{Player.controls.fastReverse()}
function
SetPlayMode(value)
{Player.settings.setMode(value,
true
)}
function
ChangeuiMode(value)
{Player.uiMode
=
value;}
function
AjustSound()
{
if
(event.srcElement.name
==
"
turnup
"
&&
Player.settings.volume
<=
100
)
{Player.settings.volume
+=
10
}
if
(event.srcElement.name
==
"
turndown
"
&&
Player.settings.volume
>=
0
)
{Player.settings.volume
-=
10
}
}
</
script
>
<
SCRIPT
LANGUAGE
= "JScript"
FOR
= "Player"
EVENT
= "MediaChange"
>
el(
"
spnCurrentMediaName
"
).innerText
=
Player.currentMedia.name;
el(
"
spnCurrentMediaDuration
"
).innerText
=
Player.currentMedia.durationString;
el(
"
spnCurrentMediaWidth
"
).innerText
=
Player.currentMedia.imageSourceWidth;
el(
"
spnCurrentMediaHeight
"
).innerText
=
Player.currentMedia.imageSourceHeight;
el(
"
spnCurrentMediaMarkerCount
"
).innerText
=
Player.currentMedia.markerCount;
el(
"
spnCurrentSourceURL
"
).innerText
=
Player.currentMedia.sourceURL;
</
SCRIPT
>
<
object
id
="Player"
width
=300
height
=300
classid
="CLSID:6BF52A52-394A-11D3-B153-00C04F79FAA6"
>
<
param
name
="URL"
value
="test.wmv"
>
<
param
name
="autoStart"
value
="1"
>
<
param
name
="balance"
value
="0"
>
<
param
name
="baseURL"
value
>
<
param
name
="captioningID"
value
>
<
param
name
="currentPosition"
value
="0"
>
<
param
name
="currentMarker"
value
="0"
>
<
param
name
="defaultFrame"
value
="0"
>
<
param
name
="enabled"
value
="1"
>
<
param
name
="enableErrorDialogs"
value
="0"
>
<
param
name
="enableContextMenu"
value
="1"
>
<
param
name
="fullScreen"
value
="0"
>