在线音乐播放(jsp+servlet+html+js) 在页面选择歌曲文件夹(可以包含子目录),提交后后台生成播放列表。 当音乐文件过多时,页面会有相应的提示信息。 单击播放列表中的因为,可播放选择的音乐文件。 文件描述: FileNameFilter.java:文件过滤器,仅扫描mp3,.wav,.mid,.rm,.rmvb,.flv,.swf,.wmv类型文件。 PlayListServlet.java:根据选择的目录,生成对应的播放列表。 PlayServlet.java:单击一首歌曲时,生成播放器并自动开始播放。 folderSelectTree.js:生成文件夹树形结构。 jsCoverCtrl.js:进行页面提示。 playIndex.jsp:选择歌曲目录的页面。 具体实现: FileNameFilter.java: import java.io.File; import java.io.FileFilter; /** * 文件:FileNameFilter.java * 描述:TODO * 作者:EX-QINCIDONG001 * 日期:2012-2-15 */ /** * @author EX-QINCIDONG001 * 文件扩展名过滤器。 */ public class FileNameFilter implements FileFilter{ // 可接收的文件类型,.mp3,.wav,.mid,.rm,.rmvb,.flv,.swf,.wmv private String[] accepts; public FileNameFilter(String[] accepts) { this.accepts = accepts; } /* (non-Javadoc) * @see java.io.FileFilter#accept(java.io.File) */ @Override public boolean accept(File pathname) { boolean ok = false; if (pathname.isFile()) { for(String ext : accepts) { if (pathname.getName().endsWith(ext)) { ok = true; break; } } } else { ok = true; } return ok; } } PlayListServlet.java: import java.io.File; import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; /** * 文件:PlayListServlet.java * 描述:TODO * 作者:luckystar2008
* 日期:2012-2-14 */ /** * @author luckystar2008
* 生成播放列表。 */ public class PlayListServlet extends HttpServlet { int index = 0; String playlist = ""; String tr = "<tr>"; String accepts[] = { ".mp3", ".wma", ".mid", ".rm", ".rmvb", ".flv", ".swf" }; /** * serialVersionUID */ private static final long serialVersionUID = 6523452712664052932L; @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { // TODO Auto-generated method stub super.doGet(req, resp); } @Override protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { req.setCharacterEncoding("gb18030"); String dir = req.getParameter("musicDir"); dir = dir.replace("\\", "/"); String musicList = makePlayList(dir); resp.setContentType("text/html;charset=gb18030"); resp.setCharacterEncoding("gb18030"); String tip = "<script type='text/javascript' src='jsCoverCtrl.js'></script>\n"; tip += "<script type='text/javascript' language='JavaScript'>\n"; tip += "<!--\n"; tip += "var currentPageStatus = document.readyState.toLowerCase();\n"; tip += "JSCoverCtrl.viewWithString('正在加载页面.....请稍侯');\n"; tip += "//-->\n"; tip += "</script>\n"; resp.getWriter().println(tip); resp.getWriter().println(musicList); String js = "<script>\n"; js += "function tdMouseOver(o) {\n"; js += " var tr = o;\n"; js += "tr.style.cursor = 'hand';\n"; js += "tr.style.backgroundColor = '#3366FF';\n"; js += "}\n"; js += "function tdMouseOut(o) {\n"; js += "var tr = o;\n"; js += "tr.style.backgroundColor = '#FFFFFF';\n"; js += "}\n"; js += "function flayMusic(o) {\n"; js += "var tr = o;\n"; js += "}\n"; js += "function play(f){\n"; // js += "alert(f);\n"; js += "playForm.action = 'play.do';\n"; js += "playForm.music.value = f;\n"; js += "playForm.submit();\n"; js += "}\n"; js += "</script>;\n"; String loading = "<script type='text/javascript' language='JavaScript'>\n"; loading += " setInterval('doit()',100);\n"; loading += " function doit(){\n"; loading += " var currentPageStatus = document.readyState.toLowerCase();\n"; loading += " if(currentPageStatus=='complete'){\n"; loading += " JSCoverCtrl.hideAllCover();\n"; loading += " }\n"; loading += " }\n"; loading += " </script>\n"; resp.getWriter().println(loading); resp.getWriter().println(js); resp.getWriter().flush(); } /** * 生成播放列表 * * @param dir * : 歌曲所在目录。 * @return */ private synchronized String makePlayList(String dir) { String table = "<div><table border=1 style='font-size:13px;'>\n"; makePlayList2(dir); table += playlist; table += "</table></div>\n"; table += "<div style='float:left;'><iframe id='musicFrm' name='musicFrm' width='500px' height='220px'>\n</iframe></div>\n"; table += "<form action='' method='post' name='playForm' target='musicFrm'><input type='hidden' name='music' ></form>\n"; // HttpServlet是单实例的,所以要重置变量。。。 playlist = ""; index = 0; tr = "<tr>"; return table; } /** * 生成tr,td * * @param dir * @return */ private synchronized void makePlayList2(String dir) { System.out.println(dir); if (dir == null || dir.trim().length() == 0) { return; } else { File dirs = new File(dir); if (dirs.exists()) { if (dirs.isDirectory()) { File[] files = dirs.listFiles(new FileNameFilter(accepts)); for (File f : files) { if (f.isFile()) { index++; tr += "<td onmouseover='tdMouseOver(this);'onmouseout='tdMouseOut(this);' onclick=\"play('" + f.getAbsolutePath().replace("\\", "/") + "')\">" + (index < 10 ? "0" + index : index) + "." + f.getName() + "</td>" + "\n"; System.out.println("index-->" + index); } else { makePlayList2(f.getAbsolutePath() .replace("\\", "/")); } if (index % 4 == 0) { // 1行4首歌曲 tr += "</tr>"; playlist += tr; tr = "<tr>"; } } } } } } } PlayServlet.java: import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; /** * Servlet implementation class PlayServlet */ public class PlayServlet extends HttpServlet { private static final long serialVersionUID = 1L; /** * @see HttpServlet#HttpServlet() */ public PlayServlet() { super(); // TODO Auto-generated constructor stub } /** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse * response) */ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub } /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse * response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("gb18030"); String musicPath = request.getParameter("music"); String obj = "<object classid='clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95' id='MediaPlayer1' width='400' height='150'>"; obj += " <param name='AudioStream' value='-1'>"; obj += "<param name='AutoSize' value='0'>"; obj += "<param name='AutoStart' value='-1'>"; obj += "<param name='AnimationAtStart' value='-1'>"; obj += "<param name='AllowScan' value='-1'>"; obj += "<param name='AllowChangeDisplaySize' value='-1'>"; obj += "<param name='AutoRewind' value='0'>"; obj += "<param name='Balance' value='0'>"; obj += "<param name='BaseURL' value>"; obj += "<param name='BufferingTime' value='5'>"; obj += "<param name='CaptioningID' value>"; obj += "<param name='ClickToPlay' value='-1'>"; obj += "<param name='CursorType' value='0'>"; obj += "<param name='CurrentPosition' value='-1'>"; obj += "<param name='CurrentMarker' value='0'>"; obj += "<param name='DefaultFrame' value>"; obj += "<param name='DisplayBackColor' value='0'>"; obj += "<param name='DisplayForeColor' value='16777215'>"; obj += "<param name='DisplayMode' value='0'>"; obj += "<param name='DisplaySize' value='2'>"; obj += "<param name='Enabled' value='-1'>"; obj += "<param name='EnableContextMenu' value='-1'>"; obj += "<param name='EnablePositionControls' value='-1'>"; obj += "<param name='EnableFullScreenControls' value='0'>"; obj += "<param name='EnableTracker' value='-1'> "; obj += "<param name='Filename' value='" + musicPath + "'>"; obj += "<param name='InvokeURLs' value='-1'>"; obj += "<param name='Language' value='-1'>"; obj += "<param name='Mute' value='0'>"; obj += "<param name='PlayCount' value='1'>"; obj += "<param name='PreviewMode' value='0'>"; obj += "<param name='Rate' value='1'>"; obj += "<param name='SAMILang' value>"; obj += "<param name='SAMIStyle' value>"; obj += "<param name='SAMIFileName' value>"; obj += "<param name='SelectionStart' value='-1'>"; obj += "<param name='SelectionEnd' value='-1'>"; obj += "<param name='SendOpenStateChangeEvents' value='-1'>"; obj += "<param name='SendWarningEvents' value='-1'>"; obj += "<param name='SendErrorEvents' value='-1'>"; obj += "<param name='SendKeyboardEvents' value='0'>"; obj += "<param name='SendMouseClickEvents' value='0'>"; obj += "<param name='SendMouseMoveEvents' value='0'>"; obj += "<param name='SendPlayStateChangeEvents' value='-1'>"; obj += "<param name='ShowCaptioning' value='0'>"; obj += "<param name='ShowControls' value='-1'>"; obj += "<param name='ShowAudioControls' value='-1'>"; obj += "<param name='ShowDisplay' value='0'>"; obj += "<param name='ShowGotoBar' value='0'>"; obj += "<param name='ShowPositionControls' value='-1'>"; obj += "<param name='ShowStatusBar' value='-1'>"; obj += "<param name='ShowTracker' value='-1'>"; obj += "<param name='TransparentAtStart' value='0'>"; obj += "<param name='VideoBorderWidth' value='0'>"; obj += "<param name='VideoBorderColor' value='0'>"; obj += "<param name='VideoBorder3D' value='0'>"; obj += "<param name='Volume' value='-40'>"; obj += "<param name='WindowlessVideo' value='0'>"; obj += "</object>"; response.setContentType("text/html;charset=gb18030"); response.getWriter().println(obj); } } folderSelectTree.js: var FolderTree = function() { //var ft = this; // 文件夹图标,分别在树展开和关闭时显示 this.driveImage = new Array("+", "-"); // 要呈现树的容器ID this.containerId = ''; // 初始化是否ok this.show = true; this.init = function(treeIcon, containerId) { if (treeIcon != null && !typeof (treeIcon) == Array) { alert("文件夹树形图标是一个数组,包含树展开和关闭,请确认!"); this.show = false; } if (treeIcon != null) { this.driveImage = treeIcon; } if (containerId != null) { this.containerId = containerId; } this.makeFolderTree(); }, // 在指定的容器展现树 this.makeFolderTree = function() { if (this.show) { var fso, s, n, e, x; var ul = "<ul id='drivelist'>"; fso = new ActiveXObject("Scripting.FileSystemObject"); e = new Enumerator(fso.Drives); for (; !e.atEnd(); e.moveNext()) { ul += "<li style='list-style:none;'><span onclick='ft.liMouseClick(this);'>" + this.driveImage[0] + "</span><span>" + e.item() + "</span><input type=checkbox name='dir' value='" + e.item() + "' onclick='ft.checkConfirmOneSelected();'></li>"; } ul += "</ul>"; if (this.containerId == '') { document.body.innerHTML = ul; } else { document.getElementById(this.containerId).innerHTML = ul; } } }, // 单击节点时,获取子目录并展现 this.liMouseClick = function(o) { o = o.parentElement; var s1 = o.childNodes[0].innerHTML.toLowerCase(); s1 = o.childNodes[0].childNodes[0].src; // 获取文件名 s1 = s1.substring(s1.lastIndexOf('/')+1,s1.length); //s1 = s1.substring(s1.indexOf('src') , s1.length - 2); var s2 = this.driveImage[0]; if (s2.indexOf(s1) > 0) { // 先判断是否已经单击过,未单击过才列出它的子目录。 if (o.childNodes.length <= 3) // 1个span(+,-),1个span(目录),1个checkbox { // 获取子目录和文件 // 根目录 var rootFolder = o.childNodes[1].innerText + "\\"; var fso = new ActiveXObject( "Scripting.FileSystemObject"); var folder = fso.GetFolder(rootFolder); var ul = "<ul>"; // 列出子目录 fc = new Enumerator(folder.SubFolders); for (; !fc.atEnd(); fc.moveNext()) { var li = "<li style='list-style:none;'><span onclick='ft.liMouseClick(this);'>" + this.driveImage[0] + "</span><span>" + fc.item() + "</span><input type=checkbox name='dir' value='" + fc.item() + "' onclick='ft.checkConfirmOneSelected();'></li>"; ul += li; } //fc = new Enumerator(folder.files); // 列出目录下的文件 // for (; !fc.atEnd(); fc.moveNext()) // { // var li = "<li style='list-style:none;' // onclick='liMouseClick(this);'><span>"+driveImage[0]+"</span><span>"+fc.item()+"</span></li>"; // ul += li; // } ul += "</ul>"; o.innerHTML = o.innerHTML + ul; } o.childNodes[0].innerHTML = this.driveImage[1]; } else { for ( var i = 3; i < o.childNodes.length; i++) { o.removeChild(o.childNodes[i]); } o.childNodes[0].innerHTML = this.driveImage[0]; } }, // 保证只能选择一个目录 this.checkConfirmOneSelected = function() { var checkboxs = document.getElementsByTagName('input'); var index = 0; for ( var i = 0; i < checkboxs.length; i++) { if (checkboxs[i].type == 'checkbox') { if (checkboxs[i].checked) { index++; } } } if (index > 1) { alert('请选择一个文件夹!'); return; } }, // 返回选择的目录 this.showSelectedFolder = function() { this.checkConfirmOneSelected(); var checkboxs = document.getElementsByTagName('input'); var selectedFolderString = ''; for ( var i = 0; i < checkboxs.length; i++) { if (checkboxs[i].type == 'checkbox') { if (checkboxs[i].checked) { selectedFolderString = checkboxs[i].parentElement.childNodes[1].innerText + "/"; break; } } } /*if (selectedFolderString != '') { alert('选择的文件夹是:' + selectedFolderString); } else { alert('未选择文件夹'); }*/ return (selectedFolderString); } } jsCoverCtrl.js: var JSCoverCtrl = { createCover :function(){ document.write("<div id='JSCoverCtrlLoadinglookup' style='position:absolute; top:20; left:20; z-index:10; visibility:hidden'><TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0><TR><TD bgcolor=6487DC><TABLE id='loadingTable' WIDTH=180 height=70 BORDER=0 CELLSPACING=2 CELLPADDING=0><TR><td bgcolor=E9F2FC align=center><font size=-1>正在查找数据, 请稍候...</font></td></tr></table></td></tr></table></div>"); document.write("<div id='JSCoverCtrlLoadingTemplate' style='position:absolute; top:20; left:20; z-index:10; visibility:hidden'><TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0><TR><TD bgcolor=6487DC><TABLE WIDTH=180 height=70 BORDER=0 CELLSPACING=2 CELLPADDING=0><TR><td bgcolor=E9F2FC align=center><font size=-1><span id=JSCoverCtrlLoadingText contenteditable=true>正在查找数据, 请稍候...</span></font></td></tr></table></td></tr></table></div>"); document.write("<div id='JSCoverCtrlCover' style='position:absolute; top:0; left:0; z-index:11; visibility:hidden; height:100%; width:100%' ><TABLE id='JSCoverCtrlCovertable' WIDTH=100% height=100% BORDER=0 CELLSPACING=0 CELLPADDING=0 ><TR ><TD align=center></td></tr></table></div>"); }, //显示您所需要的提示---displapString viewWithString :function(displayString){ if(displayString != null) { JSCoverCtrlLoadingText.innerHTML=displayString; JSCoverCtrlLoadingTemplate.style.top=document.all("JSCoverCtrlCovertable").offsetHeight/2-35; JSCoverCtrlLoadingTemplate.style.left=document.all("JSCoverCtrlCovertable").offsetWidth/2-70; JSCoverCtrlLoadingTemplate.style.visibility="visible"; } else { JSCoverCtrlLoadinglookup.style.top=document.all("JSCoverCtrlCover").offsetHeight/2-20; JSCoverCtrlLoadinglookup.style.left=document.all("JSCoverCtrlCover").offsetWidth/2-20; JSCoverCtrlLoadinglookup.style.visibility="visible"; } JSCoverCtrlCover.style.visibility="visible"; }, //显示您所需要的提示---displapString hideAllCover :function(){ if (JSCoverCtrlCover.style.visibility=="visible") JSCoverCtrlCover.style.visibility="hidden"; if (JSCoverCtrlLoadingTemplate.style.visibility=="visible") JSCoverCtrlLoadingTemplate.style.visibility="hidden"; if (JSCoverCtrlLoadinglookup.style.visibility=="visible") JSCoverCtrlLoadinglookup.style.visibility="hidden"; } } JSCoverCtrl.createCover(); playIndex.jsp: <%@ page language="java" contentType="text/html; charset=GB18030" pageEncoding="GB18030"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB18030"> <meta http-equiv="cache-control" content="no-cache"> <title>Insert title here</title> <script type="text/javascript" src="jsCoverCtrl.js"></script> <script type="text/javascript" src="folderSelectTree.js"></script> <script type="text/javascript"> var ft; function submitForm() { var musicDir = playListForm.musicDir; var dir = ft.showSelectedFolder(); if (dir == '') { alert('请选择一个文件夹!'); return; } musicDir.value = dir; JSCoverCtrl.viewWithString('正在检查并提交.....请稍侯'); playListForm.submit(); } window.onload = function() { ft = new FolderTree(); var treeIcons = new Array("<img src='./icons/folder.gif' width='15px' height='15px'>","<img src='./icons/folder-open.gif' width='15px' height='15px'>"); ft.init(treeIcons,'tree'); } </script> </head> <body> <form action="playlist.do" " method="post" name='playListForm'> <table> <tr> <td>选择歌曲目录:</td> <td> <input type='hidden' name='musicDir' id="musicDir"> <div id='tree'></div> </td> </tr> <tr align="center"> <td><input type='button' value='确定' onclick='submitForm();'></td> </tr> </table> </form> </body> </html>
相关推荐
运用了jsp+servlet+Oracle技术,结合html+css+js 酒店预订系统。运用了jsp+servlet+Oracle技术,结合html+css+js 酒店预订系统。运用了jsp+servlet+Oracle技术,结合html+css+js 酒店预订系统。运用了jsp+servlet+...
在音乐网站中,Servlet通常用来处理用户请求,如登录、注册、搜索歌曲、播放音乐等操作。Servlet接收HTTP请求,处理数据,然后生成响应。Servlet生命周期包括加载、初始化、服务、销毁四个阶段。 **文档** 在这个...
在IT行业中,构建一个在线购物系统是常见的任务,而JSP、Servlet和JavaBean是JavaEE平台下开发Web应用的三大核心组件,常用于构建动态网站。本项目以"JSP+servlet+javabean实现购物车"为主题,旨在演示如何使用这些...
这个项目是一个基于JSP和Servlet技术构建的音乐网站,用于展示和播放音乐。JSP(JavaServer Pages)是Java平台上的动态网页技术,而Servlet是Java Web开发中的核心组件,常用于处理HTTP请求。两者结合,可以创建强大...
【标题】:“jsp+servlet+javabean学生信息管理系统”是一种基于Web的教育管理软件,它结合了三种核心技术——JavaServer Pages(JSP)、Servlet和JavaBeans,用于实现对学生信息的有效管理和操作。这个系统旨在提高...
【标题】:“jsp+servlet+mysql写的简易购物网站系统代码”是基于Java Web技术实现的一个基本的在线购物平台。这个系统结合了Java Server Pages (JSP)、Servlet和MySQL数据库,构建了一个用户友好的交互界面和后端...
采用jsp+servlet+javabean,jsp负责少量的页面处理,以servlet为主。 结构清晰明了,未对页面做美工处理,因此html和javascript代码很少, 详细介绍了jdbc的常用api以及数据库中的表的级联。 开发调试平台...
在这个"用jsp+servlet+javabean做的博客系统"中,我们可以学习到三个关键的技术栈:JavaServer Pages (JSP)、Servlet以及JavaBeans。下面将详细阐述这三个技术在构建博客系统中的作用和知识点。 1. **JavaServer ...
【标题】"学生公寓管理系统 JSP+Servlet+MySQL+Layui.zip" 是一个基于Java Web技术的学生公寓管理系统的源代码资源。这个系统利用了多种技术来实现对公寓信息、学生住宿信息等进行管理和查询的功能。 【JSP】全称为...
在JSP中,HTML、CSS和JavaScript与Java代码混合编写,提供了便捷的视图层开发方式。在本教学管理系统中,JSP主要负责展示用户界面,通过内置对象如`request`、`response`、`session`等处理HTTP请求,以及通过`jsp:...
7. **界面设计**:JSP页面负责展示用户界面,可能使用HTML、CSS和JavaScript进行布局和交互设计。 在源代码中,`javaBean`可能是用来封装业务逻辑和数据的对象,它们通常包含get和set方法,方便在JSP和Servlet之间...
JSP页面可以包含HTML、CSS、JavaScript以及嵌入式的Java代码。通过JSP,开发者能够将静态内容与动态数据结合起来,使得页面内容可以根据用户的请求和服务器的数据动态变化。例如,在商品详情页,JSP可以获取商品...
【标题】"jsp+servlet+javabean实现的新闻发布系统"是基于Java Web技术构建的一个典型应用,主要用于展示和管理在线新闻。这个系统利用了JavaServer Pages(JSP)、Servlet和JavaBeans组件来完成动态网页的开发,...
《图书管理系统:基于jsp+javabean+servlet的实现》 在信息技术日益发达的今天,图书管理系统的构建已经成为图书馆信息化建设的重要组成部分。本系统采用jsp、javabean和servlet技术进行开发,旨在提供高效、便捷的...
压缩包中的文件可能包括JSP文件(如employee.jsp、department.jsp等)、Servlet类文件(如EmployeeServlet.java、DepartmentServlet.java等)、配置文件(如web.xml)、数据库连接文件(如db.properties)、以及相关...
通常,Servlet会处理用户登录、搜索、播放音乐等操作。 3. **JavaBean**:JavaBean是一种符合特定规范的Java类,它封装了业务逻辑和数据,通常作为MVC架构中的模型层。在音乐项目中,JavaBean可能包含音乐信息(如...
《基于JavaBean、Servlet、JSP与MySQL的网上书店管理系统详解》 在互联网技术日新月异的今天,网上书店管理系统已经成为许多实体书店扩展业务、提高服务效率的重要工具。本项目"javaBean+servlet+jsp+mysql网上书店...
本文将深入探讨`JSP(JavaServer Pages)、Servlet、JavaBean`以及`Ajax`如何在MVC架构下实现数据的增删改查与分页显示,并涉及`SmartUpload`组件用于文件和图片的上传。 首先,`MVC`模式是一种软件设计模式,它将...
【标题】"JSP+servlet实现后台超市管理系统"是一个典型的Web应用开发项目,它结合了Java服务器页面(JSP)和Servlet技术,用于构建一个基于Java的后台管理系统。在这个系统中,开发人员使用了JDK 1.7作为Java开发...
在本项目中,"Java+Servlet+Jdbc+Jsp+Mysql实现Web学生信息管理系统",开发者利用了Java后端技术、Servlet、JDBC、JSP以及MySQL数据库来构建一个完整的Web应用,用于管理学生信息。以下是这些技术在系统中的具体应用...