时间年月选择

最新推荐文章于 2023-06-25 17:29:11 发布

CXY-Saxon

最新推荐文章于 2023-06-25 17:29:11 发布

阅读量147

点赞数

分类专栏：案例学习文章标签： javascript js

本文链接：https://blog.youkuaiyun.com/qq_42666439/article/details/105699873

版权

案例学习专栏收录该内容

6 篇文章

订阅专栏

<!DOCTYPE HTML>
<html>
  <head>
  <title>时间年月选择</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
  <script src="jquery-1.11.1.min.js" type="text/javascript"></script>
  <script src='bootstrap.js'></script>
  <script src='bootstrap-datepicker.js'></script>
  <script src="bootstrap-datepicker.zh-CN.js"></script>
  <link href="bootstrap-datepicker3.min.css" rel="stylesheet" />
	<style>
		.form_datetime{
            border: 1px solid #ddd;
		}	
		/* 修改弹出日历样式 */
		/*.datepicker{
		width:5rem;
		line-height: .6rem;
		background:#eee;
		position:absolute;
		top:1rem;
		right:.6rem;
		z-index: 10;
	}*/	
	</style>

<script type="text/javascript">
	$(document).ready(function(){
        $(".form_datetime").datepicker({
            startView: 'years',  //起始选择范围
            maxViewMode:'years', //最大选择范围
            minViewMode:'months', //最小选择范围
            todayHighlight : true,// 当前时间高亮显示
            autoclose : 'true',// 选择时间后弹框自动消失
            format : 'yyyy年mm月',// 时间格式
            language : 'zh-CN',// 汉化
            todayBtn:"linked",//显示今天 按钮
            clearBtn : true,// 清除按钮，和今天 按钮只能显示一个
        });
    });
</script>

  </head>
  
  <body>
	  <input type="text" class="form_datetime" placeholder="请选择时间" checked>
  </body>
</html>