Question

我想将JQuery datetimepicker与波斯日历结合使用。由于它没有得到官方支持，我正在尝试使用moment.js和moment-jalaali.js。

我设法将输入更改为波斯日期。

我的意思是点击2014年12月6日，输入将变为“1393/9/15”，这是波斯日历中的相同日期。

这就是我到目前为止所做的：

<script type="text/javascript" src="jquery.datetimepicker.js')}}"></script>
<script type="text/javascript" src="moment.min.js')}}"></script>
<script type="text/javascript" src="moment-jalaali.js')}}"></script>
<script type="text/javascript">
    Date.parseDate = function( input, format ){
        return moment(input,format).toDate();
    };
    Date.prototype.dateFormat = function( format ){
        return moment(this).format(format);
    };
    $(document).ready(function () {
        $('.datepicker').datetimepicker({
            format: 'jYYYY/jM/jD - H:m',
            lang: 'fa'
        });
    });
</script>

但是日历仍然显示格里高利历。并将“lang”选项添加到datepicker，只更改日历的语言。

我必须用波斯语日历填充日历，我完全不知道如何。

Answer 1

经过很长一段时间我发现this repo非常有用。

这是正常的jquery ui datepicker：

$(document).ready(function(){
  $('.date-input').datepicker();
});

div.ui-datepicker{
 font-size:12px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<link type="text/css" rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/ui-darkness/jquery-ui.css">
<input type="date" class="date-input">

可以修改为显示包含bootstrap-datepicker.min.js而不是jquery.ui.js的jalali日历。

但是：因为这个repo想为datepicker添加twitter bootstrap主题，所以datepicker中的一些类名被改为使用twitter bootstrap主题。但那不是我想要的。我希望能够使用jquery ui主题。所以我分叉了repo并将类名称编辑回jquery ui原始名称。

只需包含这些文件（jquery-ui-jalali-datepicker.min.js＆amp; datepicker.fa.min.js），即可应用任何jquery-ui主题。

结果如下：

$(document).ready(function(){
  $('.date-input').datepicker();
});

div.ui-datepicker{
 font-size:12px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://raw.githubusercontent.com/Taxellool/jquery-ui-jalali-datepicker/master/jquery-ui-jalali-datepicker.min.js"></script>
<script src="https://raw.githubusercontent.com/Taxellool/jquery-ui-jalali-datepicker/master/datepicker.fa.min.js"></script>
<link type="text/css" rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/ui-darkness/jquery-ui.css">
<input type="date" class="date-input"/>

使用波斯语（jalaali）日历填充JQuery datetimepicker

1 个答案: