87,904
社区成员
发帖
与我相关
我的任务
分享紧急求救！！！日历控件的文字变色功能的实现！
基本思路：用一个日历控件，在点击日期的时候，实现该日期的字体颜色改变。
求解决思路！万分感谢！！！！
代码如下（很简短的）：
<html>
<head><title>Calendar</title>
<script language="javascript">
<!--
// fill the month table with column headings
var gcGray = "#808080";
var gcToggle = "#ffff00";
var gcBG = "#cccccc";
var iCellWidth=19;
var iDateTextSize=12;
var year=2003;
var styleTD = " bgcolor='"+gcBG+"' width='"+iCellWidth+"' bordercolor='"+gcBG+"' valign='middle' align='center' style='font:bold "+iDateTextSize+" Courier;";
//公历节日 *表示放假日
var sFtv = new Array(
"0101*New Year",
"0214*Volientin's Day",
"0501*国际劳动节",
"1001*国庆节 世界音乐日 国际老人节",
"1224*平安夜",
"1225*圣诞节");
function day_title(day_name){
document.write("<TD "+styleTD+"color:#990099' >"+day_name+"</TD>")
}
function fSetDate(giYear,giMonth,giDay,iCell)
{
var truthBeTold = window.confirm("Push the \"OK\" button to add this day as holiday,push the \"Cancel\" button to cancel it");
if (truthBeTold) {
giMonth = giMonth + 1;
var m,d;
if(giMonth < 10)
m = new String("0"+giMonth);
else
m = new String(giMonth);
if(giDay < 10)
d = new String("0"+giDay);
else
d = new String(giDay);
var tstr = m + d + "*Custom";
sFtv[sFtv.length] = tstr;
iCell.innerHTML = "<font style='cursor:hand;font:12 Fixedsys' color=red onclick='fSetDate("+year+","+mon+","+day+",this);'>"+giDay+"</font>";//此处欲改变，但代码不起作用。
}
}
function checkHoli(iMon,iDay)
{
iMon = iMon + 1;
var m,d;
if(iMon < 10)
m = new String("0"+iMon);
else
m = new String(iMon);
if(iDay < 10)
d = new String("0"+iDay);
else
d = new String(iDay);
var tstr = m + d + "*";
for(var i=0;i<sFtv.length;i++)
{
if(sFtv[i].indexOf(tstr) != -1 )
{
return true;
}
}
return false;
}
// fills the month table with numbers
function fill_table(month,month_length,mon)
{
day=1
// begin the new month table
document.write("<TABLE BORDER=0 bgcolor='#6699cc' CELLSPACING=0 CELLPADDING=%0><TR>")
document.write("<TD COLSPAN=7 ALIGN=center><B>"+month+" "+year+"</B><TR>")
// column headings
day_title("Sun")
day_title("Mon")
day_title("Tue")
day_title("Wed")
day_title("Thu")
day_title("Fri")
day_title("Sat")
// pad cells before first day of month
document.write("</TR><TR>")
for (var i=1;i<start_day;i++){
document.write("<TD>")
}
// fill the first week of days
for (var i=start_day;i<8;i++){
if(i==1||i==7)
{
document.write("<TD ALIGN=center><font style='cursor:hand;font:12 Fixedsys' color=red onclick='fSetDate("+year+","+mon+","+day+",this); return true;'>"+day+"</font></TD>");
}
else
{
var iCol = "#ffffff";
if(checkHoli(mon,day))
iCol = "red";
document.write("<TD ALIGN=center><font style='cursor:hand;font:12 Fixedsys' color='"+iCol+"' onclick='fSetDate("+year+","+mon+","+day+",this); return true;'>"+day+"</font></TD>");
}
day++;
}
document.write("<TR>")
// fill the remaining weeks
while (day <= month_length) {
for (var i=1;i<=7 && day<=month_length;i++){
if(i==1 || i==7){
document.write("<TD ALIGN=center><font style='cursor:hand;font:12 Fixedsys' color=red onclick='fSetDate("+year+","+mon+","+day+",this); return true;'>"+day+"</font></TD>");
}
else
{
iCol = "#ffffff";
if(checkHoli(mon,day))
iCol = "red";
document.write("<TD ALIGN=center><font style='cursor:hand;font:12 Fixedsys' color='"+iCol+"' onclick='fSetDate("+year+","+mon+","+day+",this); return true;'>"+day+"</font></TD>");
//document.write("<TD ALIGN=center><font style='cursor:hand;font:12 Fixedsys' color='#FFFFFF' onclick='fSetDate("+year+","+mon+","+day+",this);'>"+day+"</font></TD>");
}
day++;
}
document.write("</TR><TR>")
// the first day of the next month
start_day=i
}
document.write("</TR></TABLE>")
document.close();
}
// end hiding -->
</script>
</head>
<body>
<script language="javascript">
// CAHNGE the below variable to the CURRENT YEAR
var gMonths = new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");
// first day of the week of the new year
today= new Date("January 1, "+year)
start_day = today.getDay() + 1 // starts with 0
document.write("<Table width='100%'><tr align='center' valign='top'><td>")
for(h=0;h<1;h++)
{
var iDaysInMonth=new Date(year, h+1, 0).getDate();
fill_table(gMonths[h],iDaysInMonth,h);
if((h+1)%4 == 0)
{
if(h<11)
document.write("</td></tr><tr height=20></tr><tr align='center' valign='top'><td>");
else
document.write("</td></tr>");
}
else
{
document.write("</td><td>");
}
}
document.write("</table>");
document.close();
</script>
<input type="button" onclick="subdata();" value="Submit the Settings">
</body>
</html>
求解决思路！万分感谢！！！！
代码如下（很简短的）：
<html>
<head><title>Calendar</title>
<script language="javascript">
<!--
// fill the month table with column headings
var gcGray = "#808080";
var gcToggle = "#ffff00";
var gcBG = "#cccccc";
var iCellWidth=19;
var iDateTextSize=12;
var year=2003;
var styleTD = " bgcolor='"+gcBG+"' width='"+iCellWidth+"' bordercolor='"+gcBG+"' valign='middle' align='center' style='font:bold "+iDateTextSize+" Courier;";
//公历节日 *表示放假日
var sFtv = new Array(
"0101*New Year",
"0214*Volientin's Day",
"0501*国际劳动节",
"1001*国庆节 世界音乐日 国际老人节",
"1224*平安夜",
"1225*圣诞节");
function day_title(day_name){
document.write("<TD "+styleTD+"color:#990099' >"+day_name+"</TD>")
}
function fSetDate(giYear,giMonth,giDay,iCell)
{
var truthBeTold = window.confirm("Push the \"OK\" button to add this day as holiday,push the \"Cancel\" button to cancel it");
if (truthBeTold) {
giMonth = giMonth + 1;
var m,d;
if(giMonth < 10)
m = new String("0"+giMonth);
else
m = new String(giMonth);
if(giDay < 10)
d = new String("0"+giDay);
else
d = new String(giDay);
var tstr = m + d + "*Custom";
sFtv[sFtv.length] = tstr;
iCell.innerHTML = "<font style='cursor:hand;font:12 Fixedsys' color=red onclick='fSetDate("+year+","+mon+","+day+",this);'>"+giDay+"</font>";//此处欲改变，但代码不起作用。
}
}
function checkHoli(iMon,iDay)
{
iMon = iMon + 1;
var m,d;
if(iMon < 10)
m = new String("0"+iMon);
else
m = new String(iMon);
if(iDay < 10)
d = new String("0"+iDay);
else
d = new String(iDay);
var tstr = m + d + "*";
for(var i=0;i<sFtv.length;i++)
{
if(sFtv[i].indexOf(tstr) != -1 )
{
return true;
}
}
return false;
}
// fills the month table with numbers
function fill_table(month,month_length,mon)
{
day=1
// begin the new month table
document.write("<TABLE BORDER=0 bgcolor='#6699cc' CELLSPACING=0 CELLPADDING=%0><TR>")
document.write("<TD COLSPAN=7 ALIGN=center><B>"+month+" "+year+"</B><TR>")
// column headings
day_title("Sun")
day_title("Mon")
day_title("Tue")
day_title("Wed")
day_title("Thu")
day_title("Fri")
day_title("Sat")
// pad cells before first day of month
document.write("</TR><TR>")
for (var i=1;i<start_day;i++){
document.write("<TD>")
}
// fill the first week of days
for (var i=start_day;i<8;i++){
if(i==1||i==7)
{
document.write("<TD ALIGN=center><font style='cursor:hand;font:12 Fixedsys' color=red onclick='fSetDate("+year+","+mon+","+day+",this); return true;'>"+day+"</font></TD>");
}
else
{
var iCol = "#ffffff";
if(checkHoli(mon,day))
iCol = "red";
document.write("<TD ALIGN=center><font style='cursor:hand;font:12 Fixedsys' color='"+iCol+"' onclick='fSetDate("+year+","+mon+","+day+",this); return true;'>"+day+"</font></TD>");
}
day++;
}
document.write("<TR>")
// fill the remaining weeks
while (day <= month_length) {
for (var i=1;i<=7 && day<=month_length;i++){
if(i==1 || i==7){
document.write("<TD ALIGN=center><font style='cursor:hand;font:12 Fixedsys' color=red onclick='fSetDate("+year+","+mon+","+day+",this); return true;'>"+day+"</font></TD>");
}
else
{
iCol = "#ffffff";
if(checkHoli(mon,day))
iCol = "red";
document.write("<TD ALIGN=center><font style='cursor:hand;font:12 Fixedsys' color='"+iCol+"' onclick='fSetDate("+year+","+mon+","+day+",this); return true;'>"+day+"</font></TD>");
//document.write("<TD ALIGN=center><font style='cursor:hand;font:12 Fixedsys' color='#FFFFFF' onclick='fSetDate("+year+","+mon+","+day+",this);'>"+day+"</font></TD>");
}
day++;
}
document.write("</TR><TR>")
// the first day of the next month
start_day=i
}
document.write("</TR></TABLE>")
document.close();
}
// end hiding -->
</script>
</head>
<body>
<script language="javascript">
// CAHNGE the below variable to the CURRENT YEAR
var gMonths = new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");
// first day of the week of the new year
today= new Date("January 1, "+year)
start_day = today.getDay() + 1 // starts with 0
document.write("<Table width='100%'><tr align='center' valign='top'><td>")
for(h=0;h<1;h++)
{
var iDaysInMonth=new Date(year, h+1, 0).getDate();
fill_table(gMonths[h],iDaysInMonth,h);
if((h+1)%4 == 0)
{
if(h<11)
document.write("</td></tr><tr height=20></tr><tr align='center' valign='top'><td>");
else
document.write("</td></tr>");
}
else
{
document.write("</td><td>");
}
}
document.write("</table>");
document.close();
</script>
<input type="button" onclick="subdata();" value="Submit the Settings">
</body>
</html>
...全文
请发表友善的回复…
发表回复
