Jquery datepicker限制输入的小技巧

Jquery的datepicker是常用的网页日期选择控件,相对也很简单,但仍有一些问题会让萌新感到棘手,这里放一个我最近用到的写法,可能会解决一些问题。

首先是引用控件,以及中文本地化设置。然后客户的要求是,既能通过键盘输入日期,又可以通过光标点击来选择。

<script type="text/javascript">
    jQuery(function ($) {
        $.datepicker.regional['zh-CN'] = {
            closeText: '关闭',
            prevText: '上月',
            nextText: '下月',
            currentText: '今天',
            monthNames: ['一月', '二月', '三月', '四月', '五月', '六月',
            '七月', '八月', '九月', '十月', '十一月', '十二月'],
            monthNamesShort: ['一', '二', '三', '四', '五', '六',
            '七', '八', '九', '十', '十一', '十二'],
            dayNames: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
            dayNamesShort: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
            dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],
            weekHeader: '周',
            dateFormat: 'yy/mm/dd',
            firstDay: 1,
            isRTL: false,
            showMonthAfterYear: true,
            changeMonth: true,
            changeYear: true,
            yearSuffix: '年'
        };
        $.datepicker.setDefaults($.datepicker.regional['zh-CN']);
        $('.datepicker').bind('change', function () {
            $(this).datepicker('option', 'dateFormat', 'yy/mm/dd');
        });
        $('.datestart').bind('change', function () {
            $('.datefinish').datepicker('option', 'minDate', this.value);
        });
    });
</script>

猜你喜欢

转载自blog.csdn.net/liuqixuan1994/article/details/78634407