iPad或iPhone上的Javascript日历兼容性?

iPad或iPhone上的Javascript日历兼容性?,javascript,php,ios,Javascript,Php,Ios,我在ipad或iphone上查看自定义日历时遇到问题。它在台式机、iMac和安卓设备上都能完美工作,但在基于ios的ipad或iphone上却不行 问题是日历似乎不起作用,因为日历是以直线查看的,而不是在一周结束后新建一条线。我认为这可能是两个平台之间的javascript兼容性问题。 下面是生成日历的脚本 <script> function calendar(month) { var padding = ""; var totalFeb = ""; var i = 1; var

我在ipad或iphone上查看自定义日历时遇到问题。它在台式机、iMac和安卓设备上都能完美工作,但在基于ios的ipad或iphone上却不行

问题是日历似乎不起作用,因为日历是以直线查看的,而不是在一周结束后新建一条线。我认为这可能是两个平台之间的javascript兼容性问题。 下面是生成日历的脚本

<script>
function calendar(month) {

var padding = "";
var totalFeb = "";
var i = 1;
var testing = "";

var current = new Date();
var cmonth = current.getMonth();
var day = current.getDate();
<?php if (isset($_GET['year']))
{
$year = $_GET['year'];
?>
var year = <?php echo $year ?>;
<?php
}
else
{
 ?>
var year = current.getFullYear();
<?php } 
?>
var tempMonth = month + 1;
var prevMonth = month - 1;


if (month == 1) {
    if ((year % 100 !== 0) && (year % 4 === 0) || (year % 400 === 0)) {
        totalFeb = 29;
    } else {
        totalFeb = 28;
    }
}

var monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var dayNames = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var totalDays = ["31", "" + totalFeb + "", "31", "30", "31", "30", "31", "31", "30", "31", "30", "31"];

var tempDate = new Date(tempMonth + ' 1 ,' + year);
var tempweekday = tempDate.getDay();
var tempweekday2 = tempweekday;
var dayAmount = totalDays[month];

while (tempweekday > 0) {

    padding += "<td class='premonth' bgcolor='#E0E0DF'></td>";
    //preAmount++;
    tempweekday--;

    }
while (i <= dayAmount) {

var paramM = <?php echo $a; ?>;
var paramY = <?php echo $yearcalendar; ?>;
var totalParam = ""+paramY+"-"+paramM+"-"+i+"";

    if (tempweekday2 > 6) {
        tempweekday2 = 0;
        padding += "</tr><tr>";
    }

if (tempweekday2 == 0 || tempweekday2 == 6)
{

    if (i == day && month == cmonth) {
        padding += "<td class='weekends'  onMouseOver='this.style.background=\"#00FF00\"; this.style.color=\"#FFFFFF\"' onMouseOut='this.style.background=\"#F2F2F2\"; this.style.color=\"#F2F2F2\"'  ><div class='textarea-container2'>" + i + "<a href='http://www.ssic.com.my/e-system/e-driver/form.php?date="+totalParam+"' class='various' data-fancybox-type='iframe'><textarea readonly>click</textarea></div></td>";
    } 
    else {
        padding += "<td class='weekends' onMouseOver='this.style.background=\"#F2F2F2\"' onMouseOut='this.style.background=\"#F2F2F2\"'><div class='textarea-container4'>" + i + "<a href='http://www.ssic.com.my/e-system/e-driver/form.php?date="+totalParam+"' class='various' data-fancybox-type='iframe'><textarea readonly>click</textarea><div class='test'></div></div></td>";
    }
}
else
{
    if (i == day && month == cmonth) {
        padding += "<td bgcolor='#A9D1FA' class='currentday' onMouseOver='this.style.background=\"#6699FF\"; this.style.color=\"#FFFFFF\"' onMouseOut='this.style.background=\"#A9D1FA\"; this.style.color=\"#FFFFFF\"'><div class='textarea-container3'>" + i + "<a href='http://www.ssic.com.my/e-system/e-driver/form.php?date="+totalParam+"' class='various' data-fancybox-type='iframe'><textarea readonly>Today's Date</textarea></a></div></td>";
    } 
    else {
        padding += "<td bgcolor='#fff' class='currentmonth' onMouseOver='this.style.background=\"#F2F2F2\"' onMouseOut='this.style.background=\"#FFFFFF\"'><div class='textarea-container2'>" + i + "<a href='http://www.ssic.com.my/e-system/e-driver/form.php?date="+totalParam+"' class='various' data-fancybox-type='iframe'><textarea readonly>click here</textarea></a><div class='test'></div></div></td>";
    }
}
    tempweekday2++;
    i++;
}

var calendarTable = "<table class='calendar' bgcolor='E0E0DF'> <tr class='currentyear'><th class='blue' colspan='7'><?php echo"<a href='view.php?a=$previousM&year=$previousY' STYLE='TEXT-DECORATION: NONE'>&lt;&lt;</a>"; ?> " + monthNames[month] + " " + year + " <?php echo"<a href='view.php?a=$nextM&year=$nextY' STYLE='TEXT-DECORATION: NONE'>&gt;&gt;</a>"; ?></th></tr>";
calendarTable += "<tr class='weekdays'>  <th>Sun</th>  <th>Mon</th> <th>Tue</th> <th>Wed</th> <th>Thu</th> <th>Fri</th> <th>Sat</th> </tr>";
calendarTable += "<tr>";
calendarTable += padding;
calendarTable += "</tr></table>";
document.getElementById("calendar").innerHTML += calendarTable;
}

function go12() {

for (i = <?php echo $i ?>; i < <?php echo $a ?>; i++) {
    calendar(i);
}
}

if (window.addEventListener) {
window.addEventListener('load', go12, false);
}   else if (window.attachEvent) {
window.attachEvent('onload', go12);
}
</script>

我将非常感谢任何关于这个问题的帮助或评论。谢谢

我建议可能使用其他人构建的东西,而不是自己构建。它们可能涵盖了您尚未构建的用例。问题是这是一个web系统应用程序,每个设备都可以通过web浏览器访问。如果我使用的是已经构建的移动日历应用程序,它就不能在PC上显示。有什么想法吗?1。创建一个独特的移动网站,例如m.site.com或mobile.site.com 2。设计现有网站以适应各种移动设备,即所谓的“响应式设计”,并使用CSS3媒体查询。最后,你可以试着看看这个插件是否对你有帮助。我不知道你想要的日历有多详细。我曾尝试构建一个web应用程序,它可以实现你所说的所有功能,如移动、web等。最后,很难在不同设备、不同版本的操作系统和不同版本的web浏览器上对每个浏览器进行测试。如果我能再做一次,我会选择1,做一些用户代理嗅探并将它们发送到专用的移动或浏览器体验。分而治之会让你的生活更轻松。