`
txf2004
  • 浏览: 6854161 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

《JavaWeb---简单应用---服务器向客户端提供音乐资源(二)》---歌曲展示页面提升,实现渐变色显示,选中行变色

 
阅读更多

在以前基础上又在当页添加了播放器,点击简单播放,即可实现播放选中曲目.

以前版本查看点击这里

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ page import="java.io.File"%>
<%@ page import="java.net.URL"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
	<head>

		<title>音乐列表</title>

<style>
body {
	text-align: center;
}

.even{
	background-color: #FFFF99
}
.odd{
	background-color: #FFCCFF
}

tr:HOVER {
	background-color: #00FFCC
}
</style>

<script language="javascript">
function playMusic(url){
FenghuoMP.filename=url;
FenghuoMP.autostart=true;
}
</script>

</head>

<body>
	<font color="red">本站提供下列音乐:</font>
	<br />
	
	<object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
		id="FenghuoMP" height="40" width="300" >
		<param name="Filename"
			value="${pageContext.request.contextPath }/resource/musiclist.m3u">
		<param name="autostart" value="0">
		<param name="stretchToFit" value="0"> 
	</object><br />

	<%-- 利用JSTL结合EL表达式,将域中歌曲信息展现给用户 --%>
	<table border="1" width="50%">
	<c:forEach var="music" items="${musics }" varStatus="i">
	<tr class="${i.count%2==0? 'even':'odd' }">
		<td>${music.value }</td>
		<td><a href='${pageContext.request.contextPath }/resource/music/${music.key }'>下载</a></td>
		<td><a href='${pageContext.request.contextPath }/servlet/PlayMusic?resname=${music.key }'
			target='_blank'> 播放</a></td>
		<td><a href='javascript:void(0)' onclick="playMusic('${pageContext.request.contextPath }/resource/music/${music.key }')"> 简单播放</a>
		<br /></td>
	</tr>
	</c:forEach>
	</table>
	
</body>
</html>

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics