jquery ui 中 datepicker的汉化

2021-7-23    前端达人

首先上 html代码 



    

    
  1. 

        
    

            
    

            
    

        
    

        
    

            
    
                <!--为防止一个页面出现多个id 我们改用class 
            
    

        
    

    
    2. 

    
  2. 

        
    

            
    

            
    

        
    

        
    

            
    
                 为防止手工填写格式出错 我们设置属性为 readonly
            
    

        
    

    
    3. 

    
  3. 

        
    

            
    

            
    

        
    

        
    

            
    
                 只能选 ，不能填 ok
            
    

        
    

    
    4. 

    
  4. 

        
    

            
    

            
    

        
    

        
    

            
    
                -->
            
    

        
    

    
    5. 

    
  5. 

        
    

            
    

            
    

        
    

        
    

            
    
                <input type="text" class="datepicker" readonly="readonly"/>
            
    

        
    

    
    6.



然后是jquery ui 初始化部分代码



    

    
  1. 

        
    

            
    

            
    

        
    

        
    

            
    
                //日期格式改变
            
    

        
    

    
    2. 

    
  2. 

        
    

            
    

            
    

        
    

        
    

            
    
                $( ".datepicker" ).datepicker({dateFormat: "yy-mm-dd"});
            
    

        
    

    
    3. 

    
  3. 

        
    

            
    

            
    

        
    

        
    

            
    
                //星期格式汉化
            
    

        
    

    
    4. 

    
  4. 

        
    

            
    

            
    

        
    

        
    

            
    
                $( ".datepicker" ).datepicker( "option", "dayNamesMin",[ "日", "一", "二", "三", "四", "五", "六" ] );
            
    

        
    

    
    5. 

    
  5. 

        
    

            
    

            
    

        
    

        
    

            
    
                //月份格式汉化
            
    

        
    

    
    6. 

    
  6. 

        
    

            
    

            
    

        
    

        
    

            
    
                $( ".datepicker" ).datepicker( "option", "monthNames", [ "一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月" ] );
            
    

        
    

    
    7.



注：jquery ui 的设置有两种，一种是在初始化的时候就填入参数

另一种是在初始化之后，在设置参数。这里为了说明参数选项，我们选择的第二种方式来讲解。



效果图： 



官方说明地址: http://api.jqueryui.com/datepicker/#option-altFormat

下载地址：http://download.jqueryui.com/download


蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码蓝小助，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。

截屏2021-05-13 上午11.41.03.png



文章来源：csdn

分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

分享本文至：
« UI动效设计之设计原则 datatable 拖动列宽 鼠标拖动列宽 »

分类

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档