网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的考试资料:

 

标题 Ext JS框架中日期函数的用法及日期选择控件的实现
内容
    Ext.Date是一个单例,封装了一系列日期操作函数,扩展JavaScript Date的功能,下面列出一些常用的功能。
    基本函数:
    Ext.Date.add(date, interval, value) 给date增加或减少时间,这个函数不改变原有Date对象的值,而是返回一个新的Date对象。
    Ext.Date.between(date, start, end) 判断date是否在start和end之间。
    Ext.Date.clearTime(date, clone) 把date的时间设置成00小时00分00秒000毫秒。
    Ext.Date.clone(date) 克隆date的一个副本。
    Ext.Date.format(date, format)把日期格式化,返回格式化后的字符串。
    Ext.Date.getDayOfYear(date)获取date是年中的第几天。
    Ext.Date.getDaysInMonth(date)获取date是月中的第几天。
    Ext.Date.getFirstDateOfMonth(date)获取date所在月份的第一天。
    Ext.Date.getFirstDayOfMonth(date)获取date所在月份第一天的星期。
    Ext.Date.getLastDateOfMonth(date)获取date所在月份的最后一天。
    Ext.Date.getLastDayOfMonth(date)获取date所在月份最后一天的星期。
    Ext.Date.getWeekOfYear(date) 获取date所在年中的第几个星期。
    Ext.Date.isLeapYear(date)date所在年份是否闰年。
    Ext.Date.now() 返回当前时间到1970年1月1日的毫秒数。在chrome、ie9和ie10中已经有Date.now()实现相同的功能。
    Ext.Date.parse(input, format, strict)根据输入的字符串创建日期,Date.parse()有类似的功能。
    下面零碎地举几个例子综合来看一下:
    // Ext.Date.add(date, interval, value) 给date增加或减少时间,这个函数不改变原有Date对象的值,而是返回一个新的Date对象。 
    // @param  {Date}  date   原日期对象。 
    // @param  {String} interval value的单位,可以选Ext.Date.DAY、Ext.Date.HOUR、Ext.Date.MINUTE、Ext.Date.MONTH、 
    //               Ext.Date.SECOND、Ext.Date.YEAR、Ext.Date.MILLI。 
    // @param  {number} value   日期对象需要增加的值。 
    // @return {Date}       返回增加值后的Date对象。 
    // Example 
    var date = Ext.Date.add(new Date('10/29/2006'), Ext.Date.DAY, 5); //增加5天 
    console.log(date); //返回结果 Fri Nov 03 2006 00:00:00 GMT+0800 (中国标准时间) 
    var date = Ext.Date.add(new Date('10/29/2006'), Ext.Date.DAY, -5); //减少5天,如果值是负数,则减少。 
    console.log(date); //返回结果 Tue Oct 24 2006 00:00:00 GMT+0800 (中国标准时间) 
    var date = Ext.Date.add(new Date('10/29/2006'), Ext.Date.YEAR, 2); //增加2年 
    console.log(date); //返回结果 Wed Oct 29 2008 00:00:00 GMT+0800 (中国标准时间) 
    // Ext.Date.between(date, start, end) 判断date是否在start和end之间。 
    // @param  {Date}   date  要判断的日期。 
    // @param  {Date}   start  
    // @param  {Date}   end 
    // @return {Boolean}     如果date在start和end之间返回true,否则返回false。 
    // Example 
    var date = new Date('10/29/2006'); 
    var start = new Date('10/5/2006'); 
    var end = new Date('11/15/2006'); 
    Ext.Date.between(date, start, end); //返回true 
    // Ext.Date.clearTime(date, clone) 把date的时间设置成00小时00分00秒000毫秒。 
    // @param  {Date}   date  
    // @param  {Bollean} clone 可选参数。如果为true则返回date的一个副本,如果为false则返回date本身,默认为false。 
    // @return {Date}      返回设置后的日期。 
    // Example 
    var date = new Date('10/30/2012 14:30:00'); 
    Ext.Date.clearTime(date); //返回 Tue Oct 30 2012 00:00:00 GMT+0800 (中国标准时间) 
    // Ext.Date.clone(date) 克隆date的一个副本。 
    // @param  {Date} date 
    // @return {Date} 返回克隆后的Date。 
    // Example 
    var orig = new Date('10/30/2012'); 
    var copy = Ext.Date.clone(orig); //克隆一个值 
    // Ext.Date.format(date, format) 把日期格式化,返回格式化后的字符串。 
    // @param  {Date}  date  日期。 
    // @param  {String} format 日期格式,Y-年,m-月,d-日,H-24小时,i-分钟,s-秒 
    // @return {String}     返回格式化后的字符串。 
    // Example 
    var date = new Date('10/20/2012 14:30:00'); 
    Ext.Date.format(date, 'Y-m-d H:i:s');    // 2012-10-20 14:30:00 
    Ext.Date.format(date, 'Y年m月d日 H:i:s');  // 2012年10月20日 14:30:00 
    // Ext.Date.getDayOfYear(date) 获取date是年中的第几天 
    // @param  {Date}  date 日期。 
    // @return {Number}    返回天数,取值范围0~364,如果是闰年则有365。 
    // Example 
    var date = new Date('10/20/2012 14:30:00'); 
    Ext.Date.getDayOfYear(date); //返回 293 
    // Ext.Date.getDaysInMonth(date) 获取date是月中的第几天 
    // @param  {Date}  date 日期。 
    // @return {Number}    返回天数。 
    // Example 
    var date = new Date('10/20/2012 14:30:00'); 
    Ext.Date.getDayOfYear(date); //返回 31 
    // Ext.Date.getFirstDateOfMonth(date) 获取date所在月份的第一天 
    // @param  {Date} date 日期。 
    // @return {Date}    返回所在月份的第一天。 
    // Example 
    var date = new Date('10/20/2012 14:30:00'); 
    Ext.Date.getFirstDateOfMonth(date); //返回 Mon Oct 01 2012 00:00:00 GMT+0800 (中国标准时间) 
    // Ext.Date.getFirstDayOfMonth(date) 获取date所在月份第一天的星期 
    // @param  {Date}  date 日期。 
    // @return {Number}    返回所在月份第一天的星期,取值范围0~6。 
    // Example 
    var date = new Date('10/20/2012 14:30:00'); 
    Ext.Date.getFirstDayOfMonth(date); //返回 1,表示星期一 
    // Ext.Date.getLastDateOfMonth(date) 获取date所在月份的最后一天 
    // @param  {Date} date 日期。 
    // @return {Date}    返回所在月份的最后一天。 
    // Example 
    var date = new Date('10/20/2012 14:30:00'); 
    Ext.Date.getLastDateOfMonth(date); //返回 Wed Oct 31 2012 00:00:00 GMT+0800 (中国标准时间) 
    // Ext.Date.getLastDayOfMonth(date) 获取date所在月份最后一天的星期 
    // @param  {Date}  date 日期。 
    // @return {Number}    返回所在月份最后一天的星期,取值范围0~6。 
    // Example 
    var date = new Date('10/20/2012 14:30:00'); 
    Ext.Date.getLastDayOfMonth(date); //返回 3,表示星期三 
    // Ext.Date.getWeekOfYear(date) 获取date所在年中的第几个星期 
    // @param  {Date}  date 日期。 
    // @return {Number}    返回所在年中的第几个星期,取值范围1~53。 
    // Example 
    var date = new Date('10/20/2012 14:30:00'); 
    Ext.Date.getWeekOfYear(date); //返回 42 
    // Ext.Date.isLeapYear(date) date所在年份是否闰年 
    // @param  {Date}   date 日期。 
    // @return {Boolean}    true表示闰年,false表示平年。 
    // Example 
    var date = new Date('10/20/2012 14:30:00'); 
    Ext.Date.isLeapYear(date); //返回 true 
    // Ext.Date.now()   返回当前时间到1970年1月1日的毫秒数。 
    //          在chrome、ie9和ie10中已经有Date.now()实现相同的功能。 
    // @return {Number} 返回毫秒数。 
    // Example 
    var timestamp = Ext.Date.now(); //1351666679575 
    var date = new Date(timestamp); //Wed Oct 31 2012 14:57:59 GMT+0800 (中国标准时间) 
    // Ext.Date.parse(input, format, strict) 根据输入的字符串创建日期,Date.parse()有类似的功能。 
    // @param {String}  input  日期字符串。 
    // @param {String}  format 日期格式。 
    // @param {Boolean} strict 验证input字符串的有效性,默认是false。 
    // @param {Date}       返回创建的日期。 
    // Example 
    var input = '2012年10月31日 14:30:00'; 
    var format = 'Y年m月d日 H:i:s'; 
    var date = Ext.Date.parse(input, format, true); //Wed Oct 31 2012 14:30:00 GMT+0800 (中国标准时间)
    实例:实现带week(星期)的日期选择控件
    1.问题:
    是否使用了Ext JS 就可以完美的解决 星期的问题呢?
    在本系列的第一篇就有说到, Ext 的datepicker 并不能看到星期, 需要自己去扩展。
    但是, 扩展的时候就有一个问题了:
    Javascript 语言的Date对象每周是从星期天开始。
    而Ext JS的getWeekOfYear这个方法却又是遵循 ISO-8601, 每周是从星期一开始的。(其他的方法又有不是遵循此标准的, Ext JS混合了不同的日期时间表示标准)。
    Ext.Date.getWeekOfYear 这个方法的返回值是 1- 53 之间的数。
    这样的话, 就会出现一些问题:
    Ext js 的日期显示控件的显示是从星期天开始: (S M T W T F S (星期天 星期一 星期二  .. 星期六))
    但是, 通过选中的时间获取星期时却又是从星期天开始。导致:
    每个星期天的星期会小1 (比如2013/08/18 , 星期天, 应该是34周,但是通过这个方法却是算成上一周的结尾 , 33 周)
    date = new Date("2013/08/18");
    var week = Ext.Date.getWeekOfYear(date);
    alert("week="+week);
    Ext Js 日期控件默认显示了 42天, 这样的话,在两个年交互的地方就会出现问题
    是当年显示 53 周呢? 还是下一年的第一周。
    2.解决方案:
    结合js 的Date 对象和 Ext js的Ext.Date, 实现获取星期字串。
    每周以星期天为第一天
    每年的周数从(1-52), 如果超过52 周,算到下一年的第一周。 比如2013/12/29 为 2013年的53周, 算到 2014年的第一周
    返回 “W1334” 这样的周的格式
    /*
     * return as W1334()2013/08/20
     * 1. if sunday==> week = week+1
     * getWeekOfYear(Ext use ISO-8601,week begin monday)
     * js Date(week begin sunday)
     * 2. if week > 52==> year = year +1; week = week - 52;
     * 3. if month ==11(12 month) and week <2 ==> year = year +1;
     */
    function getWeekStrOfDate(date)
    {
      var weekStr = null;
      if(date!=null)
      {
        weekStr = "W";
        var dateYear = date.getFullYear();
        var dateWeek = Ext.Date.getWeekOfYear(date);
        var firstDayOfMonth = Ext.Date.getFirstDayOfMonth(date);
        var day = date.getDate();
        var month = date.getMonth();
        //weekday 0-6
        var weekday = date.getDay();
        if(weekday===0)
        {
          dateWeek++;
        }
        // week>52 ==> year +1     
        if(month==11)
        {
          if(dateWeek>52)
          {    
            dateYear += 1;
            dateWeek -= 52;
          }else if(dateWeek<2){
            dateYear += 1;
          }
        }    
        var yearStr = dateYear.toString();
        yearStr = yearStr.substring(2,4);
        var dateWeekStr = dateWeek.toString();
        if(dateWeekStr.length<2)
        {
          dateWeekStr = "0" + dateWeekStr;
        }    
        weekStr += yearStr;
        weekStr += dateWeekStr;   
      }
      return weekStr;
    }
随便看

 

在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。

 

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间:2025/5/19 17:53:43