Fatal编程技术网

javascript日历中的错误

javascript jquery

javascript日历中的错误,javascript,jquery,Javascript,Jquery,我在单击“拾取日期”链接时使用了以下代码来显示日历 // JavaScript Document //script for date picker // You can edit this function if you need the date in a different format function format_date_field(y, m, d) { return '' + y + '-' + ((m > 9) ? m : '0' + m) +

我在单击“拾取日期”链接时使用了以下代码来显示日历

// JavaScript Document
//script for date picker

// You can edit this function if you need the date in a different format
function format_date_field(y, m, d) {
   return '' + y + '-' + 
          ((m > 9) ? m : '0' + m) + '-' +
          ((d > 9) ? d : '0' + d);
}



m_list = Array("January", "February", "March",
               "April",   "May",      "June",
               "July",    "August",   "September",
               "October", "November", "December");    
//target = '';
targets = Array();

function set_date_field(y, m, d, t_idx) {
   eval(targets[t_idx] + ' = unescape(\'' + escape(format_date_field(y, m, d)) + '\')' );
}

function show_cal(target_a) {
   var d = new Date();
   show_cal_m(d.getFullYear(), d.getMonth(), target_a);
}

function show_cal_m(y,m, target_a) {
   t_idx = targets.push(target_a) - 1;
   write_cal_pop(y,m, open('about:blank','cal_win'+t_idx,'width=175,height=150'), t_idx);
}

function write_cal_pop(y,m, cal_win, t_idx) {
   cal_win.document.open();
   cal_win.document.writeln('<html><head><title>Date Picker</title>');
   cal_win.document.writeln('<style type="text/css">');
   cal_win.document.writeln('td {');
   cal_win.document.writeln('   font-family: Verdana, Arial, Helvetica, sans-serif;');
   cal_win.document.writeln('   font-size: 9pt;');
   cal_win.document.writeln('   color: #000000;');
   cal_win.document.writeln('   background-color: #CCCCCC;');
   cal_win.document.writeln('   text-align: center;');
   cal_win.document.writeln('}');
   cal_win.document.writeln('th {');
   cal_win.document.writeln('   font-family: Verdana, Arial, Helvetica, sans-serif;');
   cal_win.document.writeln('   font-size: 9pt;');
   cal_win.document.writeln('   color: #000000;');
   cal_win.document.writeln('   background-color: #CC0000;');
   cal_win.document.writeln('   text-align: center;');
   cal_win.document.writeln('}');
   cal_win.document.writeln('a {');
   cal_win.document.writeln('   color: #000000;');
   cal_win.document.writeln('   text-decoration: none;');
   cal_win.document.writeln('}');
   cal_win.document.writeln('</style></head><body leftmargin=2 topmargin=2 marginwidth=2 marginheight=2>');


   var one_day     = 1000 * 60 * 60 * 24;
   //var next_month  = (m==11) ? 0 : m + 1;

   d = new Date(y,m,1, 0,0,0,0);
   d = new Date(d.valueOf() - (one_day * 6));

   while (d.getDay() != 1) {
      d = new Date(d.valueOf() + one_day);
   }

   cal_win.document.writeln('<table align="center" width="100%" height="100%">');
   cal_win.document.writeln('<tr>'); 

   //PREV
   cal_win.document.write('<th><a href="javascript: opener.write_cal_pop(');
   if (m==0) {  cal_win.document.write((y-1) + ', 11'); } 
   else      {  cal_win.document.write(y + ', ' + (m-1)); }
   cal_win.document.writeln(', self, ' + t_idx + ');">&lt;</a></td>');

   //CUR.
   cal_win.document.writeln('<th colspan=5><b>' + m_list[m] + ' ' + y + '</b></td>');

   //NEXT
   cal_win.document.write('<th><a href="javascript: opener.write_cal_pop(');
   if (m==11) {  cal_win.document.write((y+1) + ', 0');    } 
   else       {  cal_win.document.write(y + ', ' + (m+1)); }
   cal_win.document.writeln(', self, ' + t_idx + ');">&gt;</a></td>');

   cal_win.document.writeln('</tr>'); 

   //day of week header
   cal_win.document.writeln('<tr><th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th><th>S</th></tr>');

   //DAYS
   day_count = 0;
   while (day_count < 42) {
      day_count++

      if (d.getDay() == 1) { cal_win.document.writeln('<tr>'); }
      cal_win.document.writeln('<td>' + (d.getMonth()==m ? '<b>' : ''));
      cal_win.document.writeln('<a href="javascript: opener.set_date_field(' +
              d.getFullYear() + ', ' + (d.getMonth()+1) + ', ' + d.getDate() + 
              ', ' + t_idx + '); self.close();">' +  d.getDate() + '</a>');

      cal_win.document.writeln(d.getMonth()==m ? '</b></td>' : '</td>');
      //next
      //d = new Date(d.valueOf() + one_day); //replaced to stop double day in oct error
      d.setDate(d.getDate() + 1);
      //if (d.getMonth() == next_month && d.getDay() == 1) {  break;  }
   }


   cal_win.document.writeln('</table>');
   cal_win.document.writeln('</body></html>');
   cal_win.document.close();
} 

//JavaScript文档
//日期选择器脚本
//如果需要不同格式的日期，可以编辑此函数
函数格式\日期\字段（y、m、d）{
返回'+y+'-'+
（（m>9）？m:'0'+m）+'-'+
（（d>9）？d:'0'+d）；
}
m_list=数组（“一月”、“二月”、“三月”，
“四月”、“五月”、“六月”，
“七月”、“八月”、“九月”，
“十月”、“十一月”、“十二月”）；
//目标=''；
目标=数组（）；
函数集\u日期\u字段（y、m、d、t\u idx）{
eval（targets[t_idx]+'=unescape（\''+escape（格式化日期字段（y，m，d））+'\'）；
}
功能显示校准（目标校准）{
var d=新日期（）；
显示（d.getFullYear（），d.getMonth（），target_a）；
}
函数show_cal_m（y，m，target_a）{
t_idx=targets.push（target_a）-1；
写下“\u-cal\u-pop”（y，m，open（'about:blank'，'cal\u-win'+t\u-idx，'width=175，height=150'），t\u-idx）；
}
函数write_cal_pop（y、m、cal_win、t_idx）{
cal_win.document.open（）；
cal_win.document.writeln（“日期选择器”）；
cal_win.document.writeln（“”）；
calu-win.document.writeln（'td{'）；
cal_win.document.writeln（'字体系列：Verdana、Arial、Helvetica、sans serif；'）；
calu-win.document.writeln（'font-size:9pt；'）；
calu-win.document.writeln（'color:#000000；'）；
cal#u win.document.writeln（'background color:#cccc；'）；
cal_win.document.writeln（'text align:center；'）；
calu-win.document.writeln（'}'）；
cal_win.document.writeln（'th{'）；
cal_win.document.writeln（'字体系列：Verdana、Arial、Helvetica、sans serif；'）；
calu-win.document.writeln（'font-size:9pt；'）；
calu-win.document.writeln（'color:#000000；'）；
cal#u win.document.writeln（'背景色：#CC0000；'）；
cal_win.document.writeln（'text align:center；'）；
calu-win.document.writeln（'}'）；
calu-win.document.writeln（'a{'）；
calu-win.document.writeln（'color:#000000；'）；
calu-win.document.writeln（'text-decoration:none；'）；
calu-win.document.writeln（'}'）；
cal_win.document.writeln（“”）；
var一天=1000*60*60*24；
//下个月风险值=（m==11）？0:m+1；
d=新日期（y，m，1，0,0,0,0）；
d=新日期（d.valueOf（）-（一天*6））；
而（d.getDay（）！=1）{
d=新日期（d.valueOf（）+一天）；
}
cal_win.document.writeln（“”）；
cal_win.document.writeln（“”）；
//上
cal_win.document.write（“”）；
//CUR。
cal_win.document.writeln（''+m_list[m]+''+y+''）；
//下一个
cal_win.document.write（“”）；
cal_win.document.writeln（“”）；
//星期日标题
cal_win.document.writeln（“MTWTFSS”）；
//日子
天数=0；
而（天数<42）{
日数++
如果（d.getDay（）==1）{cal_-win.document.writeln（“”）}
cal_win.document.writeln（“”+（d.getMonth（）==m？“”“”）；
cal_win.document.writeln（“”）；
cal_win.document.writeln（d.getMonth（）==m？“”：“”）；
//下一个
//d=新日期（d.valueOf（）+一天）；//替换为在十月错误时停止两天
d、 设置日期（d.getDate（）+1）；
//如果（d.getMonth（）==next_month&&d.getDay（）==1）{break；}
}
cal_win.document.writeln（“”）；
cal_win.document.writeln（“”）；
cal_win.document.close（）；
}
在我的php页面中，我使用了以下代码

<td><input type="text" name="joining" id="joining"/>
                  <a href="javascript: show_cal('document.admission_form.joining.value')">pick date</a></td>
            </tr>
如果单击“拾取日期”链接，日历将在新窗口中打开。我需要日历应该在同一页的输入字段附近打开。我该怎么做？

替换

<td><input type="text" name="joining" id="joining"/>
              <a href="javascript: show_cal('document.admission_form.joining.value')">pick date</a></td>
        </tr>
与
基本上，第一个更改是href标记，其值更改为“#”，以声明它是页面的锚点（请参阅href锚点），因为它没有继续，因此是一个冗余链接。第二个更改是将日历显示功能移动到事件侦听器。

此行将导致页面在新窗口中打开

write_cal_pop(y,m, open('about:blank','cal_win'+t_idx,'width=175,height=150'), t_idx);
您正在调用open（）命令，该命令将打开一个新窗口，或者如果已经存在具有该名称的窗口，则覆盖该窗口的内容。您需要将内容写入当前DOM中的DOM元素（这可能是您在页面中指定用于显示日历的div）。

非常快速且粗略修复javascript（例如，最好使用jQuery+DatePicker） 如图所示修改功能“显示校准”、“显示校准”和“设置日期字段”，并添加其他功能：

function set_date_field(y, m, d, t_idx) {
    targets[t_idx].value = format_date_field(y, m, d);
}

function show_cal(obj, target_a) {
   var d = new Date();
   show_cal_m(obj, d.getFullYear(), d.getMonth(), target_a);
}

function show_cal_m(obj, y,m, target_a) {
   t_idx = targets.push(target_a) - 1;
   var ifr = document.createElement('iframe');
   ifr.style.width = '175px';
   ifr.style.height = '150px';
   ifr.style.position = 'absolute';
   var pos = findPos(obj);
   ifr.style.top = pos[1];
   ifr.style.left = pos[0];
   ifr.id = 'calendar';
   document.body.appendChild(ifr);
   ifr = (ifr.contentWindow) ? ifr.contentWindow : (ifr.contentDocument.document) ? ifr.contentDocument.document : ifr.contentDocument;
   write_cal_pop(y,m, ifr, t_idx);
}

function closeCalendar() {
   document.body.removeChild(document.getElementById('calendar'));    
}

function findPos(obj) {
    var curleft = curtop = 0;
    if (obj.offsetParent) {
        curleft = obj.offsetLeft
        curtop = obj.offsetTop
        while (obj = obj.offsetParent) {
            curleft += obj.offsetLeft
            curtop += obj.offsetTop
        }
    }
    return [curleft,curtop];
}
修改代码：

cal_win.document.writeln('<a href="javascript: parent.set_date_field(' +
              d.getFullYear() + ', ' + (d.getMonth()+1) + ', ' + d.getDate() + 
              ', ' + t_idx + '); parent.closeCalendar();">' +  d.getDate() + '</a>');

calwin.document.writeln（“”）；
打电话

<a href='#' onclick="show_cal(this, document.admission_form.joining); return false;">pick date</a>
查找不需要窗口的新日历。打开！有很多插件可供选择。 
<a href='#' onclick="show_cal(this, document.admission_form.joining); return false;">pick date</a>