HTML日程控件，可以在此基础上做更多的扩展，如实现行程安排等
日历控件，可以在此基础上做更多的扩展，如实现行程安排等 无 htmlhead title日历控件/title meta http-equiv="Content-Type" content="text/html; charset=utf-8"/ meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0
日历控件，可以在此基础上做更多的扩展，如实现行程安排等
<html>
<head>
<title>日历控件</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<style type="text/css">
.rili {
margin: 30px 0px;
overflow: hidden;
text-align: center;
color: #666
}
.low_calendar {
overflow: hidden;
border: 1px solid #c8d2dc;
}
.low_calendar h1 {
width: 100%;
background: #ff6f7e;
font-size: 14px;
height: 30px;
line-height: 30px;
text-align: center;
color: #fff;
font-weight: 100;
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
position: relative
}
.calGrid table {
width: 100%;
border-collapse: collapse;
margin: 0;
padding: 0;
}
.calGrid table th {
background-color: #fff;
border-left: 1px solid #whiteSmoke;
font-size: 12px;
height: 30px;
line-height: 30px;
text-align: center;
vertical-align: middle;
color: #999;
color: #505050;
border-bottom: 1px solid #C8C8C8;
}
.calGrid table td {
width: 12%;
height: 40px;
line-height: 40px;
font-size: 16px;
font-weight: 700 text-align : center;
color: #4A5056;
border-bottom: 1px solid #C8C8C8;
border-left: 1px solid #ccc;
position: relative;
overflow: hidden;
cursor: pointer;
text-align: center;
}
.calGrid table td img {
position: absolute;
left: 0;
top: 0;
display: none
}
.calGrid table td.curr img {
display: block
}
.calGrid table td.disable {
color: #ED5565;
}
.calGrid table td:first-child {
border-left: none;
}
.calGrid table tr:last-child td {
border-bottom: none;
}
.calGrid table td.holiday {
font-size: 12px;
}
.calGrid table th.week_day, .calGrid table td.week_day {
color: #ED5565
}
.calGrid table td.curr {
line-height: 25px;
font-size: 13px;
color: #fff;
background: #ff6f7e;
-moz-box-shadow: 2px #7d92a7 inset;
-webkit-box-shadow: 2px #7d92a7 inset;
box-shadow: 2px #7d92a7 dcdeeb;
}
.calGrid table td.curr span {
display: block;
font-size: 12px;
line-height: 10px;
}
.low_calendar h1 .ldate {
width: 25px;
height: 25px;
background: url(images/ldate.png) no-repeat;
float: left;
position: absolute;
top: 2px;
left: 10px;
overflow: hidden;
text-indent: -99999px
}
.low_calendar h1 .rdate {
width: 25px;
height: 25px;
background: url(images/rdate.png) no-repeat;
float: right;
position: absolute;
top: 2px;
right: 10px;
overflow: hidden;
text-indent: -99999px
}
</style>
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
<?php
/**
* User: yuluo
* Date: 2015-05-08
* Time: 下午3:08
* Desc:实现生成指定月份的日历信息 在此基础上可以无限遐想和扩展...
*/
date_default_timezone_set("Asia/Shanghai");
$time_now = time(); //strtotime("2015-02-04");
if($_REQUEST["date"]){
$time_now = strtotime($_REQUEST["date"]);
}
function getCurMonthFirstDay($date)
{
return date('Y-m-01', strtotime($date));
}
function getCurMonthLastDay($date)
{
return date('Y-m-d', strtotime(date('Y-m-01', strtotime($date)) . ' +1 month -1 day'));
}
$current_y = date("Y", $time_now);
$current_m = date("m", $time_now);
$next_m = date('Ymd', strtotime(date('Y-m-01', $time_now) . ' +1 month'));
$pre_m = date('Ymd', strtotime(date('Y-m-01', $time_now) . ' -1 month'));
?>
<div class="rili">
<div class="chosedate">
<div class="low_calendar">
<h1><a class="ldate" href="date_ctrl.php?date=<?php echo($pre_m); ?>">上一月</a><span><?php echo($current_y); ?>年<?php echo($current_m); ?>月</span><a class="rdate" href="date_ctrl.php?date=<?php echo($next_m); ?>">下一月</a></h1>
<div class="calGrid">
<table cellspacing="1" cellpadding="1">
<tbody>
<tr>
<th class="week_day">周日</th>
<th>周一</th>
<th>周二</th>
<th>周三</th>
<th>周四</th>
<th>周五</th>
<th class="week_day">周六</th>
</tr>
<?php
//$time_now = strtotime("2015-05-11");
$str_time_now = date("Y-m-d", $time_now); ////////字符串格式的当前时间
$current_month_first_day = getCurMonthFirstDay($str_time_now); /////////当前月的第一天
$current_month_first_w_val = intval(date("w", strtotime($current_month_first_day))); //////当前月第一天是一周的第几天 周日(0)是第一天
$current_month_last_day = getCurMonthLastDay($str_time_now); ////////当前月的最后一天
$current_week_val = date("w", $time_now);
$current_day_val = date("j", $time_now);
$last_day_val = date("j", strtotime($current_month_last_day)); ////////当前月最后一天的天索引
$strart_time = false;
$int_day_val = 1;
$ctrl_step = $last_day_val + $current_month_first_w_val; ////////控件结束的位置索引
for ($i = 0; $i < 42; $i++) {
if($i == 0){ ?>
<tr>
<?php }
if ($i == $current_month_first_w_val) {
$strart_time = true;
}
if ($i >= $ctrl_step) {
$strart_time = false;
}
if ($strart_time) {
$tem_current_date = date("Y-m-d",strtotime(date("Y-m", $time_now).("-").strval($int_day_val)));
$str_td_class = "";
if (($i%7)==0 || (($i + 1) % 7) == 0){
$str_td_class = "week_day";
}
?>
<td date="<?php echo($tem_current_date); ?>" class="<?php echo($str_td_class); ?>"><?php echo($int_day_val); ?></td>
<?php
$int_day_val++;
} else {
?>
<td class="null"> </td>
<?php
}
if ((($i + 1) % 7) == 0) {
?>
</tr>
<?php
}
}
?>
</tbody>
</table>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function(){
console.log($("td [date='2015-05-12']"));
});
</script>
</body>
</html>
热AI工具
Undresser.AI Undress
人工智能驱动的应用程序，用于创建逼真的裸体照片
AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。
Undress AI Tool
免费脱衣服图片
Clothoff.io
AI脱衣机
Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸！
热门文章
热工具
记事本++7.3.1
好用且免费的代码编辑器
SublimeText3汉化版
中文版，非常好用
禅工作室 13.0.1
功能强大的PHP集成开发环境
Dreamweaver CS6
视觉化网页开发工具
SublimeText3 Mac版
神级代码编辑软件(SublimeText3)
热门话题
7648
15
1392
52
91
11
73
19
36
110
win11双屏幕日历在第二台显示器上不存在怎么办?
Jun 12, 2024 pm 05:47 PM
在Windows11中组织日常工作和例行公事的一项重要工具是在任务栏中显示时间和日期。此功能通常位于屏幕的右下角，可让您即时访问时间和日期。通过单击此区域，您可以调出日历，从而更轻松地检查即将到来的约会和日期，而无需打开单独的应用程序。但是，如果您使用多个显示器，则此功能可能会遇到问题。具体来说，虽然时钟和日期显示在所有连接的显示器上的任务栏上，但单击第二个显示器上的日期和时间来显示日历的功能不可用。截至目前，此功能仅在主显示屏上起作用-它与Windows10不同，在Windows10中，单击任
win10日历显示周数
Jan 04, 2024 am 08:41 AM
很多用户们想要通过win10日历这个工具来查看当前天数，但是日历不会自动显示这一功能，其实我们只需要通过简单的设置，就能够看到今年的累计周数了哦~win10日历显示周数设置教程：1、在桌面左下角的搜索中输入日历并且打开应用。2、在打开的日历应用中，点击左下角的“齿轮”图标后，会在右侧弹出设置，我们点击“日历设置”3、继续在打开的日历设置中，找到“周数”然后将周数选项调整到“一年中的第一天”即可。4、在完成以上设置后，点击“周”即可看到今年的周数统计了。
从头到尾：如何使用php扩展cURL进行HTTP请求
Jul 29, 2023 pm 05:07 PM
从头到尾：如何使用php扩展cURL进行HTTP请求引言：在Web开发中，经常需要与第三方API或其他远程服务器进行通信。而使用cURL进行HTTP请求是一种常见而强大的方式。本文将介绍如何使用php扩展cURL来执行HTTP请求，并提供一些实用的代码示例。一、准备工作首先，确保php已安装cURL扩展。可以在命令行执行php-m|grepcurl查
Outlook日历不同步;
Mar 26, 2024 am 09:36 AM
如果您的Outlook日历无法与Google日历、Teams、iPhone、Android、Zoom、Office帐户等同步，请执行以下步骤来解决问题。日历应用程序可以连接到其他日历服务，如谷歌日历、iPhone、安卓、微软Office365等，这是非常有用的，因为它可以自动同步。但如果OutlookCalendar无法与第三方日历同步怎么办?可能的原因可能是选择错误的日历进行同步，日历不可见，后台应用程序干扰，过时的Outlook应用程序或日历应用程序，等等。修复Outlook日历不同步的初步
无法打开win10右下角的日历
Dec 26, 2023 pm 05:07 PM
有使用win0系统的小伙伴有遇见win10日历打不开的情况，这个是正常的电脑的小故障而已，在win10系统的隐私设置里可以解决，今天小编带来了详细的解决方法，下面大家一起来看看吧。win10右下角的日历打不开解决方法1、在win10系统中点击开始→点击上方的程序列表按钮→往下找到拼音（中文）R→日历2、初次使用，可能新事件会点不开（鼠标靠上去，不会有选中的深蓝色），可以在隐私中设置一下。点击桌面左上方的三道杠图标→底部就会有设置菜单;3、在弹出的界面中点击隐私;4、如果之前使用过设置，可以点击左
win10日历事件没有弹窗提醒怎么办? win10日历事件提醒没了的恢复方法
Jun 09, 2024 pm 02:52 PM
日历可以帮助用户们记录下你的行程，甚至还可以设置提醒，但是也有不少的用户们在询问win10日历事件提醒不弹出怎么办？用户们可以先检查一下windows更新情况或者是清除windows应用商店缓存来进行操作就可以了。下面就让本站来为用户们来仔细的介绍一下win10日历事件提醒不弹出问题解析吧。添加日历事件在系统菜单中点击“日历”程序。鼠标左键点击日历中的日期。在编辑窗口输入事件名称和提醒时间，点击“保存”按钮即可添加事件了。win10日历事件提醒不弹出问题解决
无期迷途采购办：日历和生日系列周边上新！
Feb 29, 2024 pm 12:00 PM
无期迷途采购办确定将于2月28日上午11点更新，玩家可以前往淘宝搜索无期迷途采购办选择店铺分类进行购买，本次为大家带来的是MBCC生日会系列及2024台历周边，一起来看看本次的商品详情。无期迷途采购办：日历和生日系列周边上新！无期迷途采购办上新！—预售时间：2024年2月28日11:00——2024年3月13日23:59采购地址：淘宝搜索【无期迷途采购办】选择【店铺】分类即可进店采购;周边介绍：本次周边上新为MBCC生日会系列及2024台历周边，请点击长图查阅详情。采购办上新周边介绍—MBCC生
PHP 函数的扩展和第三方模块
Apr 13, 2024 pm 02:12 PM
要扩展PHP函数功能，可以使用扩展和第三方模块。扩展提供附加函数和类，可通过pecl包管理器安装和启用。第三方模块提供特定功能，可通过Composer包管理器安装。实践案例包括使用扩展解析复杂JSON数据和使用模块验证数据。
