当前位置：移动技术网 > IT编程>开发语言>JavaScript > js日历控件（可精确到分钟）

js日历控件（可精确到分钟）

2019年07月31日 | 移动技术网IT编程 | 我要评论

.menu_iframe{position:absolute; visibility:inherit; top:0px; left:0px; width:170px;

<style> 
.menu_iframe{position:absolute; visibility:inherit; top:0px; left:0px; width:170px; z-index:-1; filter: alpha(opacity=0);} 
.cal_table{ border:#333333 solid 1px; border-collapse:collapse; background:#ffffff; font-size:12px} 
.cal_table td{ border:1px #ffffff solid; } 
.cal_drawdate{ background:#e3ebf6;border-collapse:collapse; width:100%} 
.cal_drawdate td{ border:1px #ffffff solid; } 
.cal_drawtime{ border:0px #ffffff solid; font-size:12px} 
.cal_drawdate td{ border:0px #ffffff solid; } 
.m_fieldset { 
    padding: 0,10,5,10; 
    text-align: center; 
    width: 150px; 
} 
.m_legend { 
    font-family: tahoma; 
    font-size: 11px; 
    padding-bottom: 5px; 
} 
.m_frameborder { 
    border-left: 1px inset #d4d0c8; 
    border-top: 1px inset #d4d0c8; 
    border-right: 1px inset #d4d0c8; 
    border-bottom: 1px inset #d4d0c8; 
    width: 35px; 
    height: 19px; 
    background-color: #ffffff; 
    overflow: hidden; 
    text-align: right; 
    font-family: "tahoma"; 
    font-size: 10px; 
} 
.m_arrow { 
    width: 16px; 
    height: 8px; 
    background:#cccccc; 
    font-family: "webdings"; 
    font-size: 7px; 
    line-height: 2px; 
    padding-left: 2px; 
    cursor: default; 
} 
.m_input { 
    width: 12px; 
    height: 14px; 
    border: 0px solid black; 
    font-family: "tahoma"; 
    font-size: 9px; 
    text-align: right; 
} 
.c_fieldset { 
    padding: 0,10,5,10; 
    text-align: center; 
    width: 180px; 
} 
.c_legend { 
    font-family: tahoma; 
    font-size: 11px; 
    padding-bottom: 5px; 
} 
.c_frameborder { 
    border-left: 1px #d4d0c8; 
    border-top: 1px #d4d0c8; 
    border-right: 1px #ffffff; 
    border-bottom: 1px #ffffff; 
    background-color: #ffffff; 
    overflow: hidden; 
    font-family: "tahoma"; 
    font-size: 10px; 
    width:100%; 
    height:120px; 
} 
.c_frameborder td { 
    width: 23px; 
    height: 16px; 
    font-family: "tahoma"; 
    font-size: 11px; 
    text-align: center; 
    cursor: default; 
} 
.c_frameborder .selected { 
    background-color:#0a246a; 
    width:12px; 
    height:12px; 
    color:white; 
    display:block; 
} 
.c_frameborder span { 
    width:12px; 
    height:12px; 
} 
.c_arrow { 
    width: 16px; 
    height: 8px; 
    background:#cccccc; 
    font-family: "webdings"; 
    font-size: 7px; 
    line-height: 2px; 
    padding-left: 2px; 
    cursor: default; 
} 
.c_year { 
    font-family: "tahoma"; 
    font-size: 11px; 
    cursor: default; 
    width:55px; 
    height:20px; 
    border:#99b2d3 solid 1px; 
} 
.c_month { 
    width:75px; 
    height:20px; 
    font:11px "tahoma"; 
    border:#99b2d3 solid 1px; 
} 
.c_datehead { 
    background-color:#99b2d3; 
    color:#ffffff; 
    border-collapse:collapse; 
} 
.c_datehead td{ border:0px #ffffff solid; } 
.rightmenu{ 
    float:left; /* 菜单总体水平位置 */ 
    list-style:none; 
    line-height:19px; /* 一级菜单高 */ 
    background:#1371a0 ; /* 所有菜单移出色 */ 
    font-weight: bold; 
    padding:0px; 
    margin:0px; 
border: 1px #000000 solid; 
} 
.rightmenu li{ 
    float:left; /* 菜单总体水平位置 */ 
    list-style:none; 
    line-height:19px; /* 一级菜单高 */ 
    background:#1371a0 ; /* 所有菜单移出色 */ 
    font-weight: bold; 
color:#ffffff; 
padding:0px; 
    margin:0px; 
border: 1px #ffffff solid; 
} 
.rightmenu li a{ 
    float:left; /* 菜单总体水平位置 */ 
    list-style:none; 
    line-height:19px; /* 一级菜单高 */ 
    background:#1371a0 ; /* 所有菜单移出色 */ 
    font-weight: bold; 
color:#ffffff !important; 
padding:0px; 
    margin:0px; 
    border-right: 0px; 
display:block; 
width:80px; 
} 
.rightmenu li a:hover{ 
    float:left; /* 菜单总体水平位置 */ 
    list-style:none; 
    line-height:19px; /* 一级菜单高 */ 
    background:#b2cfdf ; /* 所有菜单移出色 */ 
    font-weight: bold; 
color:#000000 !important; 
padding:0px; 
    margin:0px; 
    border-right: 0px; 
width:80px; 
text-decoration:none; 
} 
</style> 
 
点击弹出时间框：<input class="input" type="text" name="bgntime" style="width:120" value="" id="bgntime" onclick="showcal(bgntime);"> 
<div id='datetime' onclick='event.cancelbubble=true' style='position:absolute;visibility:hidden;width:100px;height:100px;left=0px;top=0px;z-index:100;)'> 
<table class="cal_table" border='0'><tr><td> 
 
</td></tr><tr><td valign='top' align='center'> 
 
</td></tr></table></div>

[ctrl+a 全选注:如需引入外部js需刷新才能执行]

您可能感兴趣的文章:

如您对本文有疑问或者有任何想说的，请点击进行留言回复，万千网友为您解惑！

相关文章:

umeditor图片上传成功, 但提示上传失败

第一次使用umeditor做简单的富文本, 感觉挺顺利的, 文字样式等都保存下来了并成功地回显. 在上传图片... [阅读全文]
笔记--axios

get 无参请求<script src="https://unpkg.com/axios/dist/axi... [阅读全文]
vue中使用axios发起post请求, 常见问题及demo示例

axios使用中，常见问题：1.axios中，post传参后台服务器收不到参数2.axios中，调用借口报400... [阅读全文]
sip来电

前面刚说了锁屏下要接电话紧接着又提出假如有多通电话同时进来怎么处理笔者就矜矜业业又去测试了普通电话的多通... [阅读全文]
uni-app封装请求方法

新建http.js,写入请求的封装方法,在页面调用；//http.jsconst baseUrl = 'http... [阅读全文]
Js vs php 判断系统

JSfunction IOSVersion() {var ua = navigator.userAgent.to... [阅读全文]
Cordova + Vue打包iOS，Xcode提交至TestFlight

确保已经安装过node.js和npm1. 安装Cordovasudo npm install -g cordov... [阅读全文]
JS实现放大镜效果

js实现放大镜效果，供大家参考，具体内容如下鼠标移到图片上就可以放大一块区域代码：<!doctype html><html lang="en"... [阅读全文]
js+canvas绘制图形验证码

本文实例为大家分享了利用canvas绘制图形验证码的具体代码，供大家参考，具体内容如下思路：通过随机获取指定字符串的指定数的字符，通过canvas绘制出来返回指... [阅读全文]
JavaScript实现多层颜色选项卡嵌套

本文实例为大家分享了javascript实现多层颜色选项卡嵌套的具体代码，供大家参考，具体内容如下这是学javascript时候的一个作业，如果没有思路还是挺有... [阅读全文]

网友评论


验证码：

移动技术网