jQuery 在与日历交互之前,日期选择器显示错误的语言
jQuery Datepicker displays wrong language until interection with the calendar
在完全自定义的 Wordpress 页面中,使用 Woody Snippets 插件编写为 PHP 片段,我需要使用 jQuery 日期选择器来 select 日期。
我正确地导入了必要的文件,也正确地调用和设置了日期选择器。昨天,我将日期选择器附加到一个隐藏的输入字段,这样当我点击一个图标时,日历就会漂浮在原地,一切都很好,甚至是本地化,虽然我没有采取任何本地化措施日历(导入 i18n 文件等)...
今天,我不得不稍微更改一下页面布局,所以我不得不从头开始显示日历(内联)。根据 demo 页面,为了将日期选择器内联,您所要做的就是将其附加到 div 而不是输入字段。
日期选择器确实变成了一个内联元素,但是本地化消失了......初始语言是英语,直到我以任何方式与日历交互(前后一个月,或选择一个日期, ETC)。一旦我这样做,本地化就会变成我网站的语言!
更疯狂的是,即使我专门导入并设置了本地化,这种情况仍然存在。
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js" integrity="sha512-uto9mlQzrs59VwILcLiRYeLKPPbS/bT71da/OEBYEwcdNUk8jYIy+D176RYoop1Da+f9mvkYrmj5MCLZWEtQuA==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/i18n/jquery-ui-i18n.min.js" integrity="sha512-zZ27MiE6yuwkKbHnJ/7ATQF/7l+Jwk5jSxgmLJ1SS5QJexaYswmP3OKBPDVMfM8TlSOudAKHTWH2UtS+0LDddw==" crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
$('#frontpages-date-filter').datepicker($.extend({},
$.datepicker.regional['el'], {
dateFormat: 'yymmdd',
minDate: new Date({$min['y']}, {$min['m']}, {$min['d']}),
maxDate: new Date({$max['y']}, {$max['m']}, {$max['d']}),
onSelect: function(dateText) {
window.location.href = location.protocol + '//' + location.host + location.pathname + '?date=' + dateText;
}
}
));
});
</script>
在下面的 JSFiddle
中,完全相同的代码从一开始就可以正常工作
根据我到目前为止的搜索,它很可能与 WP v4.6+ 有关,其中本地化自动添加到 jQuery,但无论我尝试过什么,我都没有无法使内联日期选择器加载本地化,而无需以任何方式与之交互!
顺便说一句,我注意到了完全相同的行为,甚至为 ACF 的开发人员记录了一个简短的 video,认为这与他们的插件有关,但他们回应说这不是因为他们的插件,因为它在管理员端,所以我没有浪费时间进一步调试它。但是这次页面在public这边,所以必须修复!
非常感谢任何帮助。提前致谢。
这一定是我的网站发生了冲突。 TBH,我无法发现冲突,但我可以通过在日期选择器启动之前设置必要的语言字符串来规避它,如下所示:
$(function() {
$.datepicker.regional['el'] = {
closeText: 'Κλείσιμο',
prevText: 'Προηγούμενος',
nextText: 'Επόμενος',
currentText: 'Σήμερα',
monthNames: ['Ιανουάριος', 'Φεβρουάριος', 'Μάρτιος', 'Απρίλιος', 'Μάιος', 'Ιούνιος', 'Ιούλιος', 'Αύγουστος', 'Σεπτέμβριος', 'Οκτώβριος', 'Νοέμβριος', 'Δεκέμβριος'],
monthNamesShort: ['Ιαν', 'Φεβ', 'Μαρ', 'Απρ', 'Μαι', 'Ιουν', 'Ιουλ', 'Αυγ', 'Σεπ', 'Οκτ', 'Νοε', 'Δεκ'],
dayNames: ['Κυριακή', 'Δευτέρα', 'Τρίτη', 'Τετάρτη', 'Πέμπτη', 'Παρασκευή', 'Σάββατο'],
dayNamesShort: ['Κυρ', 'Δευ', 'Τρι', 'Τετ', 'Πεμ', 'Παρ', 'Σαβ'],
dayNamesMin: ['Κ', 'Δ', 'Τ', 'Τ', 'Π', 'Π', 'Σ'],
weekHeader: 'Εβδ',
dateFormat: 'dd/mm/yy',
firstDay: 1,
isRTL: false,
showMonthAfterYear: false,
yearSuffix: ''
};
$.datepicker.setDefaults($.datepicker.regional['el']);
$('#frontpages-date-filter').datepicker();
});
在完全自定义的 Wordpress 页面中,使用 Woody Snippets 插件编写为 PHP 片段,我需要使用 jQuery 日期选择器来 select 日期。
我正确地导入了必要的文件,也正确地调用和设置了日期选择器。昨天,我将日期选择器附加到一个隐藏的输入字段,这样当我点击一个图标时,日历就会漂浮在原地,一切都很好,甚至是本地化,虽然我没有采取任何本地化措施日历(导入 i18n 文件等)...
今天,我不得不稍微更改一下页面布局,所以我不得不从头开始显示日历(内联)。根据 demo 页面,为了将日期选择器内联,您所要做的就是将其附加到 div 而不是输入字段。
日期选择器确实变成了一个内联元素,但是本地化消失了......初始语言是英语,直到我以任何方式与日历交互(前后一个月,或选择一个日期, ETC)。一旦我这样做,本地化就会变成我网站的语言!
更疯狂的是,即使我专门导入并设置了本地化,这种情况仍然存在。
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js" integrity="sha512-uto9mlQzrs59VwILcLiRYeLKPPbS/bT71da/OEBYEwcdNUk8jYIy+D176RYoop1Da+f9mvkYrmj5MCLZWEtQuA==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/i18n/jquery-ui-i18n.min.js" integrity="sha512-zZ27MiE6yuwkKbHnJ/7ATQF/7l+Jwk5jSxgmLJ1SS5QJexaYswmP3OKBPDVMfM8TlSOudAKHTWH2UtS+0LDddw==" crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
$('#frontpages-date-filter').datepicker($.extend({},
$.datepicker.regional['el'], {
dateFormat: 'yymmdd',
minDate: new Date({$min['y']}, {$min['m']}, {$min['d']}),
maxDate: new Date({$max['y']}, {$max['m']}, {$max['d']}),
onSelect: function(dateText) {
window.location.href = location.protocol + '//' + location.host + location.pathname + '?date=' + dateText;
}
}
));
});
</script>
在下面的 JSFiddle
中,完全相同的代码从一开始就可以正常工作根据我到目前为止的搜索,它很可能与 WP v4.6+ 有关,其中本地化自动添加到 jQuery,但无论我尝试过什么,我都没有无法使内联日期选择器加载本地化,而无需以任何方式与之交互!
顺便说一句,我注意到了完全相同的行为,甚至为 ACF 的开发人员记录了一个简短的 video,认为这与他们的插件有关,但他们回应说这不是因为他们的插件,因为它在管理员端,所以我没有浪费时间进一步调试它。但是这次页面在public这边,所以必须修复!
非常感谢任何帮助。提前致谢。
这一定是我的网站发生了冲突。 TBH,我无法发现冲突,但我可以通过在日期选择器启动之前设置必要的语言字符串来规避它,如下所示:
$(function() {
$.datepicker.regional['el'] = {
closeText: 'Κλείσιμο',
prevText: 'Προηγούμενος',
nextText: 'Επόμενος',
currentText: 'Σήμερα',
monthNames: ['Ιανουάριος', 'Φεβρουάριος', 'Μάρτιος', 'Απρίλιος', 'Μάιος', 'Ιούνιος', 'Ιούλιος', 'Αύγουστος', 'Σεπτέμβριος', 'Οκτώβριος', 'Νοέμβριος', 'Δεκέμβριος'],
monthNamesShort: ['Ιαν', 'Φεβ', 'Μαρ', 'Απρ', 'Μαι', 'Ιουν', 'Ιουλ', 'Αυγ', 'Σεπ', 'Οκτ', 'Νοε', 'Δεκ'],
dayNames: ['Κυριακή', 'Δευτέρα', 'Τρίτη', 'Τετάρτη', 'Πέμπτη', 'Παρασκευή', 'Σάββατο'],
dayNamesShort: ['Κυρ', 'Δευ', 'Τρι', 'Τετ', 'Πεμ', 'Παρ', 'Σαβ'],
dayNamesMin: ['Κ', 'Δ', 'Τ', 'Τ', 'Π', 'Π', 'Σ'],
weekHeader: 'Εβδ',
dateFormat: 'dd/mm/yy',
firstDay: 1,
isRTL: false,
showMonthAfterYear: false,
yearSuffix: ''
};
$.datepicker.setDefaults($.datepicker.regional['el']);
$('#frontpages-date-filter').datepicker();
});