技术帮
 

CuiMonth

本网站内容基本都是原创作品,未得到作者同意也欢迎转载
转载请注明出处:技术帮
域名:http://www.jiisb.com

1472955908895017376.png说两句


有一次作者在项目中希望在浏览器端选择年月,在网上找了半天,发现大量的控件都是实现年月日或者年月日 时分秒的选择。

后来就没办法了,只能自己写一个。

事实上作者也并没有从头写,在网上有个jquery.monthpicker.js,个人测试一下,感觉还有很多不足,就在其基础上做了若干优化。


最终效果如下:

blob.png



1473058358717068189.png 从GitHub获取cuimonth

项目部署在GitHub,下面的地址可以下载本项目。

https://github.com/cuipy/cuimonth


 在页面加入必要的css和js

本项目基于jquery,所以首先要引入jquery.js文件,同时还要加入必要的css,以实现年月选择的控件视觉效果。

<link rel="stylesheet" type="text/css"  href="css/jquery.monthpicker.css" ></link>
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="js/jquery.monthpicker.js?key=8"></script>


 加入input控件用于选择年月

月份:<input type="text" id="cui_month" readonly="readonly">


 加入js代码将input控件cui_month改造为年月选择控件 

<script type="text/javascript">
$(function() {
  $('#cui_month').monthpicker();
});
</script>