http://zixun.hunantv.com/求如图模块的功能代码
解决方案 »
- JS如何获取指定对象下面的表单元素的值
- 关于取消冒泡的问题~请教大家了
- js问题,急急急!
- js问题
- 你百度有阿.和阿里巴巴搜索结果.有一条搜索选择的滚动条是怎么做的
- 分少,希望能帮忙。js给img外加个链接
- 能在JS中修改<HTML>标签吗?比如给他加上xmlns:v","urn:schemas-microsoft-com:vml
- javaScript中如何实现页面的打印预览功能呢?
- 谁有能力用javascript代码转换汉字的big5及gb?(愿1000分相赠)
- 请教如何用javascript程序,当点击checkbox(客户端控件)时,判断其为checkbox.
- 逐位运算符(&、|、~、^、>>>等)有什么作用?
- 判断一个元素(对象)是否为另一个元素的子元素
或者google、baidu下,例子很多
<style>
.close {
background:orange;
color:white;
}
.open {
background:white;
color:black;
}
</style>
<TABLE id="intro" border="1">
<TR>
<TD>收视指南</TD>
<TD class="close" onclick="show(this)">周日</TD>
<TD class="close" onclick="show(this)">周一</TD>
<TD class="close" onclick="show(this)">周二</TD>
<TD class="close" onclick="show(this)">周三</TD>
<TD class="close" onclick="show(this)">周四</TD>
<TD class="close" onclick="show(this)">周五</TD>
<TD class="close" onclick="show(this)">周六</TD>
</TR>
<TR height="100px">
<TD colspan="8" style="display:none">周日节目单</TD>
<TD colspan="8" style="display:none">周一节目单</TD>
<TD colspan="8" style="display:none">周二节目单</TD>
<TD colspan="8" style="display:none">周三节目单</TD>
<TD colspan="8" style="display:none">周四节目单</TD>
<TD colspan="8" style="display:none">周五节目单</TD>
<TD colspan="8" style="display:none">周六节目单</TD>
</TR>
</TABLE> <SCRIPT LANGUAGE="JavaScript">
<!--
var lastOpenIndex;
var date = new Date();
var day = date.getDay(); //取当前是星期几
var tab = document.getElementById("intro");
tab.rows[0].cells[day+1].className = "open"; //改变相应标签的样式
tab.rows[1].cells[day].style.display = ""; //显示相应的内容
lastOpenIndex = day;
//点标签触发的函数
function show(td){
tab.rows[0].cells[lastOpenIndex+1].className = "close";
tab.rows[1].cells[lastOpenIndex].style.display = "none";
td.className = "open";
tab.rows[1].cells[td.cellIndex-1].style.display = "";
lastOpenIndex = td.cellIndex-1;
}
//-->
</SCRIPT>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<style type="text/css">HTML {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: baseline; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px; outline: 0
}
BODY {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: baseline; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px; outline: 0
}
DIV {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: baseline; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px; outline: 0
}
SPAN {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: baseline; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px; outline: 0
}
H2 {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: baseline; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px; outline: 0
}
A {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: baseline; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px; outline: 0
}
UL {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: baseline; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px; outline: 0
}
LI {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: baseline; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px; outline: 0
}
.col_2a_1 {
FLOAT: left; OVERFLOW: hidden; WIDTH: 400px
}#program_menu .tab {
BACKGROUND: url(http://zixun.hunantv.com/source/images/zixun/bg.gif) no-repeat 0px -250px; OVERFLOW: hidden; HEIGHT: 25px
}
#program_menu .tab H2.title {
FONT-SIZE: 14px; FLOAT: left; WIDTH: 84px; COLOR: #4a1e1e; LINE-HEIGHT: 25px; HEIGHT: 25px; TEXT-ALIGN: center
}
#program_menu .tab H2.title A {
COLOR: #4a1e1e; TEXT-DECORATION: none
}
#program_menu .tab H2.title A:hover {
TEXT-DECORATION: underline
}
#program_menu .tab UL {
FLOAT: left
}
#program_menu .tab UL LI {
FONT-SIZE: 12px; FLOAT: left; OVERFLOW: hidden; WIDTH: 39px; LINE-HEIGHT: 25px; HEIGHT: 25px; TEXT-ALIGN: center
}
#program_menu .tab UL LI A {
DISPLAY: block; BACKGROUND: url(http://zixun.hunantv.com/source/images/zixun/bg.gif) no-repeat left -290px; WIDTH: 39px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 25px; TEXT-DECORATION: none
}
#program_menu .tab UL LI A:hover {
COLOR: #333333
}
#program_menu .tab UL LI A.current {
BACKGROUND: url(http://zixun.hunantv.com/source/images/zixun/bg.gif) no-repeat -39px -290px; COLOR: #333333
}
#program_menu .b {
BORDER-RIGHT: #cccccc 1px solid; BACKGROUND: #f6f6f6; OVERFLOW: hidden; BORDER-LEFT: #cccccc 1px solid; HEIGHT: 131px
}
#program_menu .f {
FONT-SIZE: 0px; BACKGROUND: url(http://zixun.hunantv.com/source/images/zixun/bg.gif) no-repeat 0px -170px; HEIGHT: 5px
}
#program_menu .pm_list {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 4px; PADDING-TOP: 4px
}
#program_menu .pm_list UL {
BACKGROUND: url(http://zixun.hunantv.com/source/images/zixun/pmlist_bg.gif) 50% top; WIDTH: 100%
}
#program_menu .pm_list LI {
FLOAT: left; WIDTH: 50%; COLOR: #333333; LINE-HEIGHT: 16px; HEIGHT: 16px
}
#program_menu .pm_list LI SPAN.t {
FONT-WEIGHT: bold; FONT-SIZE: 11px; FLOAT: left; MARGIN-LEFT: 10px; WIDTH: 45px; COLOR: #cc3300; HEIGHT: 16px
}
#program_menu .live {
PADDING-LEFT: 10px; FLOAT: left; LINE-HEIGHT: 25px; HEIGHT: 25px
}
#program_menu .live A {
COLOR: #000000; TEXT-DECORATION: underline
}
#program_menu .live A:hover {
COLOR: #ffffff
}.fix {
CLEAR: both
}.sp {
MARGIN-BOTTOM: 10px
}.f {
FONT-SIZE: 0px; BACKGROUND: url(http://zixun.hunantv.com/source/images/zixun/bg.gif) no-repeat 0px -85px; OVERFLOW: hidden; HEIGHT: 5px
}
</style>
<script type="text/javascript">
var xmlHttp; //解析XML文件
var toDay; //当天日期
var curDate, curTime, curWeek, curHour, curMin; //当前的时间
var channelObject, channelDateObject, channelPlayBillObject, curDayDateObject; //频道对象//每次显示N个节目function createXMLHttpRequest()
{
if (window.ActiveXObject)
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}else if (window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest("Msxml2.XMLHTTP.3.0");
}
}function doSearch(url)
{ createXMLHttpRequest();
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",url,"true");
xmlHttp.send(null);
}
function handleStateChange()
{
if (xmlHttp.readyState == 4)
{
if (xmlHttp.status == 200)
{
parseXML();
}
}
}/**
* 获取当前的时间
*
*/
function getCurTime()
{
toDay = new Date();
curDate = toDay.getFullYear().toString() + '.' + (toDay.getMonth() + 1).toString() + '.' + toDay.getDate().toString();
curTime = (toDay.getMinutes() < 10) ?toDay.getHours().toString() + 0 + toDay.getMinutes(): toDay.getHours().toString() + toDay.getMinutes();
curWeek = (toDay.getDay() == 0) ? 7 : toDay.getDay();
curHour = (toDay.getHours() < 10) ? toDay.getHours() + 0 : toDay.getHours();
curHour = (curHour == 00) ? 24 : curHour;
curMin = (toDay.getMinutes() < 10) ? toDay.getMinutes() + 0 : toDay.getMinutes();
}function parseXML()
{
channelObject = xmlHttp.responseXML.getElementsByTagName("channel");
//默认显示湖南卫视的当天的节目预告
getDateObject(0);
}/**
* 获取指定频道的一周的节目信息
* cid 频道ID
*/
function getDateObject(cid)
{
getCurTime(); curDayDateObject = channelObject[cid].getElementsByTagName("playdate");
getBillObject((curWeek-1));
onTab(curWeek-1,'tab',7);
}/**
* 获取指定某一天的节目信息
* weekid 星期ID
*/
function getBillObject(weekid)
{
var curDayBillObject = curDayDateObject[weekid].getElementsByTagName("playbill");
//var liArray = new Array();
var liStr = "";
for (i = 0; i < curDayBillObject.length;i++)
{
liStr += "<li><span class='t'>" + curDayBillObject[i].firstChild.data.Trim().substr(0,5) + "</span>";
if (curDayBillObject[i].getAttribute('album') != "")
{
liStr += "<span class='name'><a href=\""+ curDayBillObject[i].getAttribute('album') +"\">" + curDayBillObject[i].firstChild.data.Trim().substr(5,15) + "</a></span>";
}
else
{
liStr += "<span class='name'>" + curDayBillObject[i].firstChild.data.Trim().substr(5,15) + "</span>";
}
liStr += "</li>";
//liArray.push(liStr);
}
document.getElementById("tab_sub_" + weekid).innerHTML = liStr;
}String.prototype.Trim = function()
{
return this.replace(/(^\s*)|(\s*$)/g,'');
}Date.prototype.DateAdd = function(Number)
{
var dtTmp = this
return new Date(Date.parse(dtTmp.toGMTString()) + (86400000 * Number));
}Date.prototype.toString = function(showWeek)
{
return this.getFullYear().toString() + '.' + (this.getMonth() + 1).toString() + '.' + this.getDate().toString();
}
/**
* 常用Tab切换
* tabid 当前值
* tab 名称
* tab 数目
* 选中的样式名称
*/
function onTab(tabid,tabname,tablength,tabclass)
{
tabclass = tabclass == undefined ? 'current' : tabclass;
for(i=0;i<tablength;i++)
{
if(tabid == i)
{
document.getElementById(""+tabname+"_"+i+"").className = tabclass;
}else{
document.getElementById(""+tabname+"_"+i+"").className = '';
}
}
var subname = tabname + "_sub";
for(j=0;j<tablength;j++)
{
if(tabid == j)
{
document.getElementById(""+subname+"_"+j+"").style.display = 'block';
}else{
document.getElementById(""+subname+"_"+j+"").style.display = 'none';
}
}
}</script>
</head><body topmargin="0" leftmargin="0">
<div class="col_2a_1">
<div id="program_menu" class="sp">
<div class="tab">
<h2 class="title"><a href="#">收视指南</a></h2>
<ul>
<li><a id="tab_0" onmouseover="javascript:onTab(0,'tab',7);getBillObject(0);">周一</a></li>
<li><a id="tab_1" onmouseover="javascript:onTab(1,'tab',7);getBillObject(1);">周二</a></li>
<li><a id="tab_2" onmouseover="javascript:onTab(2,'tab',7);getBillObject(2);">周三</a></li>
<li><a id="tab_3" onmouseover="javascript:onTab(3,'tab',7);getBillObject(3);">周四</a></li>
<li><a id="tab_4" onmouseover="javascript:onTab(4,'tab',7);getBillObject(4);">周五</a></li>
<li><a id="tab_5" onmouseover="javascript:onTab(5,'tab',7);getBillObject(5);">周六</a></li>
<li><a id="tab_6" onmouseover="javascript:onTab(6,'tab',7);getBillObject(6);">周日</a></li>
</ul>
<span class="live"><a href="#" title="直播">直播</a></span>
</div>
<div class="b">
<div class="pm_list">
<ul id="tab_sub_0"></ul>
<ul id="tab_sub_1"></ul>
<ul id="tab_sub_2"></ul>
<ul id="tab_sub_3"></ul>
<ul id="tab_sub_4"></ul>
<ul id="tab_sub_5"></ul>
<ul id="tab_sub_6"></ul>
<div class="fix"></div>
</div>
</div>
<div class="f"></div>
</div>
</div>
</body>
</html>看看到底哪里出了问题,谢谢
{
return this.getFullYear().toString() + '.' + (this.getMonth() + 1).toString() + '.' + this.getDate().toString();
}另外,无处调用doSearch函数,所以当调用getBillObject函数时报错:curDayDateObject为空或不是对象