您的位置:首页 > 运维架构 > 网站架构

日历,类似旅行网站的酒店入住

2014-03-21 11:36 232 查看
1.首先输入点击要能够有两个日历

画出月份,大部分是5x7行,但是也会有6x7的情况(1号为周六)

计算1号的位置,月份的清空,画月份时候,当日的判断。

//画表格行数
var rows = Math.ceil((maxDay+first)/7);
var beforeTable = '<div id="'+strDate+'" class="data-calendar" style="display: block;"><table><thead><tr><th>日</th><th>一</th><th>二</th><th>三</th><th>四</th><th>五</th><th>六</th></tr></thead><tbody>';
var table;
for(var i = 0 ; i < rows ; i++){
table += "<tr>" ;
for( var j = 1 ; j <= 7 ; j++){
//table += "<td>"+ (j  + 7 * i) +"</td>" //周日就是1号的判断
table += "<td></td>"
}
table+="</tr>"
}
var afterTable = '</tbody></table></div>';
$("#calendar").after(beforeTable + table + afterTable);

//填日期
for(var i = first,j = 1 ; i < tableNum,j<=maxDay ; i++,j++){
if(i != today){
//$(".data-calendar td").eq(i).css({"color":"#000"});
}else{
var num = first + today - 1;
$(".data-calendar td").eq(num).css({"color":"#ff3366"});
}
$(".data-calendar td").eq(i).html(j);
}


2.input框 click 和 change时候的区分

3.选择范围

4.更改年月日(两种情况,在input里面修改没啥特别的,在表格里面改,要把drawTable()做的更具复用性)
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: