mui日期选择插件

引入文件

	//  文件在GitHub的mui中的plugin中picker文件夹中
 	<link rel="stylesheet" href="../assets/picker/css/mui.picker.css">
  	<link rel="stylesheet" href="../assets/picker/css/mui.dtpicker.css">
  	
	<script src="../assets/picker/js/mui.picker.js"></script>
  	<script src="../assets/picker/js/mui.dtpicker.js"></script>

js文件中初始化

  // 点击页面上选择日期按钮
    $('#come').click(function () {
        // 格式化今天日期
       	var t = new Date();
    	var year = t.getFullYear();
	    var month = t.getMonth()+1>9?t.getMonth()+1:`0${t.getMonth()+1}`;     //两位数
 	    var day = t.getDate()>9?t.getDate():`0${t.getDate()}`;
        
        // 初始化日期
        var dtPicker = new mui.DtPicker({
            type: 'date', //设置日期类型为年月日
            beginDate: new Date(year,month, day), //设置开始日期为今天
            endDate: new Date(year, 11, 30), //设置结束日期为当年年底
        });
        // 显示日期选择器show()方法,参数e.value可以获取用户选中的日期
        dtPicker.show(function (e) {
            console.log(e);  
            console.log(e.value); //点击确定用户选中的日期
            console.log(e.y.text); //年
            console.log(e.m.text); //月
            console.log(e.d.text); //日
        })
    })

猜你喜欢

转载自blog.csdn.net/weixin_43848576/article/details/88043740