时间插件

时间,时分,年月日等

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>date demo</title>
    <style type="text/css">
        strong{
            font-size: 15px;
        }
        pre{
            padding: 16px 0;
            line-height: 1.45;
            background-color: #f6f8fa;
            border-radius: 3px;
        }
    </style>
</head>
<body>
    <pre>
    <strong>jquery-date.js</strong>

     <b>配置:</b>
     //不填则使用默认配置
     data-options="{'type':'YYYY-MM-DD hh:mm:ss','beginYear':2010,'endYear':2088}"

     <b>调用方式:</b>
     $.date('#date');

     <b>参数说明:</b>
     type--支持的格式
    //年月日 时分秒
    ['YYYY-MM-DD hh:mm:ss','YY-MM-DD hh:mm:ss','YYYY/MM/DD hh:mm:ss','YY/MM/DD hh:mm:ss']
    //年月日 时分
    ['YYYY-MM-DD hh:mm','YY-MM-DD hh:mm','YYYY/MM/DD hh:mm','YY/MM/DD hh:mm']
    //年月日
    ['YYYY-MM-DD','YY-MM-DD','YYYY/MM/DD','YY/MM/DD']
    //年月
    ['YYYY-MM','YY-MM','YYYY/MM','YY/MM']
    //时分秒 时分
    ['hh:mm:ss','hh:mm']

    beginYear -- 开始年份

    endYear -- 结束年份,可不填,默认不会小于当前

    limitTime--可选 today:今天之前的日期不可选 tomorrow:明天之前的不可选
    
    location--可选 before:跳转至之前选择的时间
    </pre>
    <h3>演示</h3>
    <hr>
    年月
    <br>
    <input type="text" class="date"  id="date" data-options="{'type':'YYYY-MM','beginYear':2010,'endYear':2088}" style="166px;height:19px;">
    <hr>
    年月日
    <br>
    <input type="text" id="date2" data-options="{'type':'YYYY-MM-DD','beginYear':2010,'endYear':2088}" style="166px;height:19px;">
    <hr>
    <input type="text" id="date22" data-options="{'type':'YYYY-MM-DD','beginYear':2010,'endYear':2088}" style="166px;height:19px;">
    
    年月日 时分
    <br>
    <input type="text" id="date3" data-options="{'type':'YYYY-MM-DD hh:mm','beginYear':2010,'endYear':2088}" style="166px;height:19px;">
    <hr>
    年月日 时分秒
    <br>
    <hr>
    时分秒
    <br>
    <button type="button" id="date7" data-options="{'type':'hh:mm:ss','beginYear':2010,'endYear':2088,'location':'before'}" style="170px;height:25px;vertical-align: middle;text-align: left;"></button>
    <hr>
    时分
    <br>
    <button type="button" id="date8" data-options="{'type':'hh:mm','beginYear':2010,'endYear':2088}" style="170px;height:25px;vertical-align: middle;text-align: left;"></button>
    <hr>
    时间限制
    <br>
    <button type="button" id="date5" data-options="{'type':'YYYY-MM-DD','beginYear':2010,'endYear':2088,'limitTime':'today'}" style="170px;height:25px;vertical-align: middle;text-align: left;"></button>
    <hr>
    跳转至之前选择的时间
    <br>
    <button type="button" id="date6" data-options="{'type':'YYYY-MM-DD','beginYear':2010,'endYear':2088,'location':'before'}" style="170px;height:25px;vertical-align: middle;text-align: left;"></button>
    <br>
    <br>
    <br>
    <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
    <script src="jquery.date.js"></script>
    <script>
        $.date('.date');
        $.date('#date2');
        $.date('#date22');
        $.date('#date3');
        $.date('#date4');
        $.date('#date5');
        $.date('#date6');
        $.date('#date7');
        $.date('#date8');    
    </script>
</body>
</html>
原文地址:https://www.cnblogs.com/chaojimali/p/10071496.html