Fork me on GitHub

mobiscroll 控件扩展版本

样式好看,但是找不到api

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>我的状态</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <link rel="stylesheet" href="css/sm.min.css">
    <link rel="stylesheet" href="css/sm-extend.min.css">
	<link href="css/mobiscroll.css" rel="stylesheet" />
	<link href="css/mobiscroll_date.css" rel="stylesheet" />
    <!--<style type="text/css">
		.android-ics.light .dwb-s .dwb, .android-ics.light .dwb-n .dwb{border:none;}
		.dwb-c .dwb{border-right:1px solid #dbdbdb !important;}
	</style> -->
  </head>
  <body>
    <div style="text-align:center;">  
        <h2>时间控件</h2>  
        <div>  
            <label>日期:</label>  
            <input id="EndDate" runat="server"  readonly="readonly" style="width:30%;" />  
        </div>   
        <br />  
        <div>  
            <label>日期:</label>  
            <input id="EndTime" runat="server"  readonly="readonly" style="width:30%;" />  
        </div>  
        <br />  
        <div>  
            <label>日期时间:</label>  
            <input id="AbsentEndDate" runat="server"  readonly="readonly" style="width:28%"/>  
        </div>  
    </div>  
    <script type="text/javascript" src="js/jquery-1.11.1.js" ></script>
    <script src="js/mobiscroll_date.js"></script> 
	<script src="js/mobiscroll.js"></script> 
    <script type="text/javascript">
    	$(function(){  
            var currYear = (new Date()).getFullYear();    
            var opt={};  
            opt.date = {preset : 'date'};  
            opt.datetime = {preset : 'datetime'};  
            opt.time = {preset : 'time'};  
            opt.default = {  
                theme: 'android-ics light', //皮肤样式  
                display: 'modal', //显示方式   
                mode: 'scroller', //日期选择模式  
                dateFormat: 'yy-mm-dd',  
                lang: 'zh',  
                showNow: true,  
                nowText: "今天",  
                startYear: currYear - 10, //开始年份  
                endYear: currYear + 80 //结束年份  
            };  
            $("#EndDate").mobiscroll($.extend(opt['date'], opt['default']));//年月日型  
            var optDateTime = $.extend(opt['datetime'], opt['default']);  
            var optTime = $.extend(opt['time'], opt['default']);  
            $("#AbsentEndDate").mobiscroll(optDateTime).datetime(optDateTime);//年月日时分型  
            $("#EndTime").mobiscroll(optTime).time(optTime);//时分型  
         });  
    </script>
  </body>
</html>


相关资料:

http://blog.csdn.net/qzmrock/article/details/47253527 

赋值:$("#id").val("2081-1-1");

插件链接:https://pan.baidu.com/s/1qZdJ2H2 密码:mg4w

posted @ 2018-02-05 11:55  森海轮回  阅读(276)  评论(0编辑  收藏  举报