我有一个项目,按计划按计划在网页上显示滑动图像、视频、flash、html 页面、音频等。每个时间表都有一些设计,每个设计都不过是这些组件之一(视频/音频/图像/flash/html)。我有用于计划的外部 for 循环和用于计划下的设计的内部 forloop。内部 for 循环几乎没有条件来检查媒体类型并在 jsp 页面上使用 html div 元素显示相应的数据。通过使用后端 java 代码,我得到了每个设计的正确路径。我现在想要的是为下一个时间表清除 div 元素。我尝试使用 subDiv.remove(),它无法显示视频并显示其他视频。寻求你的好建议来解决这个问题。需要在新的时间表到来时相应地清除时间表。
<html>
<head>
<meta http-equiv="Content-Type" consatent="text/html; charset=UTF-8">
<title>JSP Page</title>
<!-- <script>-->
<script type="text/javascript" src="${path}/jsp/jquery-1.10.2.js"></script>
<script type="text/javascript">
// clock function() to display the clock value
</script>
<style type="text/css">
.flags{color:blue;}
marquee div{float:left; padding:0 0 0 10px;}
</style>
</head>
<body>
<div style="position: absolute" id="mainDiv">
<c:forEach items="${List}" var="schedule" varStatus="status"> <%-- Loop for template(schedule) starts here --%>
<div id="subDiv">
<br><br>${status}--------------- Template------------------------------${design.templateId}<br><br>
<c:forEach items="${schedule.designTabModel}" var="design" varStatus="status1"><%-- Loop for design starts here --%>
<% Thread.sleep(5000);%>
<div id="subDiv1">
<c:choose>
<c:when test="${design.ctrType == 'pictureBox'}">
<%--<div style="position: absolute; top: ${design.ctrLocationX};left: ${design.ctrLocationY}">--%>
<c:forEach items="${design.files}" var="file" varStatus="status">
<%--<img src="${file}" style="position: absolute"--%>
----------Picture Box template id is: ${design.templateId}<br>
--File - ${file} - Location : X is - ${design.ctrLocationX} - Y is - ${design.ctrLocationY}<br>
</c:forEach>
</c:when>
<c:when test="${design.ctrType == 'label'}">
----------Label Box template id is: ${design.templateId}<br>
--Text Content: - ${design.ctrText} - Location : X is - ${design.ctrLocationX} - Y is - ${design.ctrLocationY}<br>
<div id="labelid" class='flags' style="position: absolute; left: ${design.ctrLocationX}; top: ${design.ctrLocationY};">
<MARQUEE BEHAVIOR='SCROLL' HEIGHT='${design.ctrHeight}' WIDTH='${design.ctrWidth}' BGColor='yellow' scrollamount="1" onmouseover="this.stop();" onmouseout="this.start();">
<div id="l1">${design.ctrText}</div>
</MARQUEE>
</div>
</c:when>
<c:when test="${design.ctrType == 'html'}">
----------Html Box template id is: ${design.templateId}<br>
--Url: - ${design.ctrText} - Location : X is - ${design.ctrLocationX} - Y is - ${design.ctrLocationY}<br>
<div id="content" style="position: absolute; left: ${design.ctrLocationX}; top: ${design.ctrLocationY}">
<iframe src="${design.ctrText}" name="frame2" id="frame2" frameborder="0" marginwidth="0" marginheight="0" scrolling="auto" onload="" allowtransparency="false" width="${design.ctrWidth}" height="${design.ctrHeight}">
</iframe>
</div>
</c:when>
<c:when test="${design.ctrType == 'clock'}">
----------Clock Box template id is: ${design.templateId}<br>
- Location : X is - ${design.ctrLocationX} - Y is - ${design.ctrLocationY}<br>
<div id="clockbox" style="position: absolute; background-color:green; border:1px solid black; padding:10px; left: ${design.ctrLocationX}; top: ${design.ctrLocationY}; height: ${design.ctrHeight}; width: ${design.ctrWidth}">
<script>GetClock();</script>
</div>
</c:when>
<c:when test="${design.ctrType == 'audio'}">
<c:forEach items="${design.files}" var="file" varStatus="status">
----------Audio template is: ${design.templateId}<br>
--File - ${file}<br>
<br>
</c:forEach>
</c:when>
<c:when test="${design.ctrType == 'video'}">
<c:forEach items="${design.files}" var="file" varStatus="status">
----------Video template is: ${design.templateId}<br>
--File - ${file}- Location X is - ${design.ctrLocationX} - Y is - ${design.ctrLocationY}<br>
<div id="videofile" style="position: absolute; left: ${design.ctrLocationX}; top: ${design.ctrLocationY}"
<object width="${design.ctrWidth}" height="${design.ctrHeight}"
type="video/x-ms-asf"
classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6">
<param name="autostart" value="1">
<param name="autosize" value="1">
<embed type="application/x-mplayer2" src="${file}" width="${design.ctrWidth}" height="${design.ctrHeight}" autostart="true" showcontrols="true" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" loop="loop" scale="tofit"></embed>
</object>
</div>
</c:forEach>
</c:when>
<c:when test="${design.ctrType == 'flashMovie'}">
<c:forEach items="${design.files}" var="file" varStatus="status">
----------Flash template is ${design.templateId}<br>
--File name is - ${file} - Location X is - ${design.ctrLocationX} - Y is - ${design.ctrLocationY}<br>
</c:forEach>
</c:when>
<c:otherwise>
</c:otherwise>
</c:choose>
</div>
</c:forEach>
</div>
<script>
$("#subDiv").remove(); // clearing the schedule
</script>
</c:forEach>
</div>
`