element.style.display='none' 不起作用

element.style.display='none' is not working

本文关键字:none 不起作用 style display element      更新时间:2023-09-26
<html>
<head>
<script type="text/javascript">
function nameofmonth(month)
 {  
 var monthname=new  Array("January","February","March","April","May","June","July","August","September","October","November","December")
  return monthname[month]
}  
 function monthdays(month,year)
 {
  var daysofmonth=new Array(31,28,31,30,31,30,31,31,30,31,30,31)
  if(year%4==0)
  daysofmonth[1]=29  
  return daysofmonth[month]   
  }
 function close(){
 document.getElementById("container").style.display='none'
 }
 function table()
  {
   var now=new Date()
   var hour=now.getHours()
   var minute=now.getMinutes()
   var second=now.getSeconds()
   var date=now.getDate()
   var month=now.getMonth() 
   var year=now.getFullYear()
   now.setFullYear(year,month,1)
   var firstday=now.getDay()
   var monthname=nameofmonth(month)
   var daysofmonth=monthdays(month,year)
    if(firstday>0)
      var k=-(firstday-1)
    else
      k=1
   var table="<table border=5 cellspacing=3cellpadding=8>"
   table +="<tr><th colspan=7>"+monthname + date+"th</th> <td  style='cursor:pointer' onclick='close()'>[close]</td></tr>"
   table +="<tr><th>sun</th><th>mon</th><th>tue</><th>wed</th><th>thu</th><th>fri</><th>sat</th></tr>"
   for(var i=0;i<5;i++)
    {
     table+="<tr>"
     for(var j=0;j<7;j++)
      {
        if(k<=daysofmonth && k>0)
          { if(k==date)
             table+='<td id="clock" bgcolor="aqua">'+k+'</td>'
          else
           table+='<td style="cursor:pointer">'+k+'</td>'
           k=parseInt(k)
         }
      else
         table+="<td></td>"
         k++
       }
  table+="</tr>"
  document.getElementById("calender").innerHTML=table  
}
}

</script>
</head>
<body>
<input type="text" onclick="table()"/>
<table id="container"><tr><td id="calender"></td></tr></table>
</body>
</html>

这是我单击文本框后出现的日历代码。这是表中的关闭单元格。单击关闭时,将调用close()函数,日历将消失。但这并没有发生。为什么?请帮助我...提前谢谢..

这与分号无关。这些大多是可选的,在本例中不需要。函数close()是保留的,不能由onclick调用。只需将close()重命名为类似closeCalendar()的名称,它应该可以正常工作。

close是一个javascript Keyword你应该使用close以外的另一个词作为你的函数名称 有关更多信息,请查看 JavaScript 保留字

这是一个演示,说明它如何更优雅地工作

<input type="text" id="cal" onclick="table(this)"/>
<div id="container">
    <div id="calender"></div>
</div>    
function nameofmonth(month)  {  
  return ["January","February","March","April","May","June","July","August","September","October","November","December"][month];
}  
function closeIt(){
  document.getElementById("container").style.display='none';
}
function table(cal) {
   var now=new Date(),
      hour=now.getHours(),
      minute=now.getMinutes(),
      second=now.getSeconds(),
      date=now.getDate(),
      month=now.getMonth(),
      year=now.getFullYear();
   now.setFullYear(year,month,1);
   var firstday=now.getDay(),
       monthname=nameofmonth(month);
   now.setFullYear(year,now.getMonth()+1,0); // last of this month
   var daysofmonth=now.getDate();
   var k=(firstday>0)?-(firstday-1):1;
   var table="<table border=5 cellspacing=3 cellpadding=8>"
   table +="<tr><th colspan=7>"+monthname + date+"th</th> <td  style='cursor:pointer' onclick='closeIt()'>[close]</td></tr>"
   table +="<tr><th>sun</th><th>mon</th><th>tue</><th>wed</th><th>thu</th><th>fri</><th>sat</th></tr>";
   for(var i=0;i<5;i++) {
     table+="<tr>";
     for (var j=0;j<7;j++) {
       if (k<=daysofmonth && k>0) {
         if (k==date) table+='<td id="clock" bgcolor="aqua">'+k+'</td>';
         else table+='<td style="cursor:pointer" onclick="document.getElementById('''+cal.id+''').value='''+(month+1)+'/'+k+'/'+year+'''">'+k+'</td>';
       }
       else table+="<td></td>";
       k++
     }
     table+="</tr>";
    }     
    document.getElementById("calender").innerHTML=table+"</table>";  
}