EasyUI——DateBox和DateTimeBox的汉化和显示格式修改

    最近做项目用到了EasyUI-DateBox控件，上网查询的查查询的时候发现还有DateTimeBox控件，其实使用的时候是一样的，只不过一个多了时间而已。

    是用这个控件的时候遇到了两个问题，一个是汉化的问题，一个是格式显示问题。

    两个控件的显示：

DateBox的默认日期格式是：

DateTimeBox的默认日期格式是：

 

汉化：

  解决方法：直接引入easyui-lang-zh_CN.js就可以了

 

  下载地址为：http://www.softhy.net/soft/33695.htm

 

格式显示问题：

 

以DateTimeBox为例进行转换，DateBox是一样的，只截取需要的代码就可以。

 

 

正则表达式实现方法：

<inputclass="easyui-datetimebox"data-options="formatter:ww4,parser:w4"style="width:200px;">yyyy年mm月dd日hh点</input>
   <scripttype="text/javascript">
        function ww4(date){
            var y = date.getFullYear();
            var m = date.getMonth()+1;
            var d = date.getDate();
            var h = date.getHours();
            return y+'年'+(m<10?('0'+m):m)+'月'+(d<10?('0'+d):d)+'日'+(h<10?('0'+h):h)+'点';
            
        }
        function w4(s){
            varreg=/[\u4e00-\u9fa5]/  //利用正则表达式分隔
            var ss = (s.split(reg));
            var y = parseInt(ss[0],10);
            var m = parseInt(ss[1],10);
            var d = parseInt(ss[2],10);
            var h = parseInt(ss[3],10);
            if (!isNaN(y) &&!isNaN(m)&& !isNaN(d) && !isNaN(h)){
                returnnewDate(y,m-1,d,h);
            } else {
                return new Date();
            }
        }
   </script>

substring函数

<inputclass="easyui-datetimebox"data-options="formatter:ww3,parser:w3"style="width:200px;">yyyy/mm/dd hh-mm-ss</input>
   <scripttype="text/javascript">
        function ww3(date){
            var y = date.getFullYear();
            var m = date.getMonth()+1;
            var d = date.getDate();
            var h = date.getHours();
            var min = date.getMinutes();
            var sec = date.getSeconds();
            var str=y+'/'+(m<10?('0'+m):m)+'/'+(d<10?('0'+d):d)+'/'+''+(h<10?('0'+h):h)+':'+(min<10?('0'+min):min)+':'+(sec<10?('0'+sec):sec);
            return str;
        }
        function w3(s){
            if (!s) return new Date();
            var y = s.substring(0,4);
            var m =s.substring(5,7);
            var d = s.substring(8,10);
            var h = s.substring(11,14);
            var min = s.substring(15,17);
            var sec = s.substring(18,20);
            if (!isNaN(y) &&!isNaN(m)&& !isNaN(d) && !isNaN(h) && !isNaN(min)&&!isNaN(sec)){
                returnnewDate(y,m-1,d,h,min,sec);
            } else {
                return new Date();
            }
        }
   </script>

 

js获取控件的值：

 varBeginTime =$("#id").datebox('getValue');

 

小结：

     一个新的东西的使用其实也很简单，利用网络以及自己的经验没有什么解决不了的~这篇博客就作为分享了~