如何根据所选语言更改日期选择器语言？
我已成功将日期选择器插入我的网页，现在运行顺利。我需要实现的是，从语言选择器更改语言后，日期选择器必须反映这一点，显示所选的语言文本。
我有以下代码，到目前为止我无法成功运行它，因为我不太了解 jquery。希望有人反馈
<head>
<script type="text/javascript" src="/scripts/datepicker.core.js"></script>
<script type="text/javascript" src="/scripts/datepicker.jquery.ui.min.js"></script>
<script type="text/javascript" src="/scripts/jquery.ui.datepicker-tr.js"></script>
<script type="text/javascript" src="/scripts/jquery.ui.datepicker-en-GB.js"></script>
</head>
<body>
<div id="LanguageSelector">
<form method="get" action="/"><select id="LanguageDropDownList" name="lang" onchange="javascript:location='/?lang=' + this.options[this.selectedIndex].value" ><option value="en" selected="selected" >English (en)</option><option value="tr">Türkçe (tr)</option></select><noscript><input type="submit" value=">"></noscript></form>
</div>
<div class="calendar" id="datepicker"></div>
<script type="text/javascript">
var initialCalendar = true;
$(function() {
$.datepicker.setDefaults( $.datepicker.regional[ ' ' ] );
var eventDays = [<%=dateOfEvent%>];
$('#datepicker').datepicker($.datepicker.regional[ 'tr' ],
{
inline: true,
dateFormat: 'yy-mm-dd',
changeMonth: true,
changeYear: true,
onSelect: function(date) {
if(!initialCalendar){
for(var i in eventDays){
if(eventDays[i].Date == date){
window.location = eventDays[i].Url;
}
}
}else{
initialCalendar = false;
}
},
beforeShowDay: function(thedate) {
thedate = thedate.format("yyyy-MM-dd");
for(var i in eventDays){
if(eventDays[i].Date == thedate){
return [true,""];
}
}
return [false, ""];
}
});
$( '#LanguageDropDownList' ).change(function() {
$( '#datepicker' ).datepicker( "option",
$.datepicker.regional[ $( this ).val() ] );
});
});
Date.prototype.format = function(format)
{
var o = {
"M+" : this.getMonth()+1,
"d+" : this.getDate(),
"h+" : this.getHours(),
"m+" : this.getMinutes(),
"s+" : this.getSeconds(),
"q+" : Math.floor((this.getMonth()+3)/3),
"S" : this.getMilliseconds()
}
if(/(y+)/.test(format)) format=format.replace(RegExp.$1,
(this.getFullYear()+"").substr(4 - RegExp.$1.length));
for(var k in o)if(new RegExp("("+ k +")").test(format))
format = format.replace(RegExp.$1,
RegExp.$1.length==1 ? o[k] :
("00"+ o[k]).substr((""+ o[k]).length));
return format;
}
</script>
</body>
I have successful inserted datepicker into my webpage and it works smoothly now. What I need to achieve is that after changing the language from language selector, datepicker must reflect this, show the selected language text.
I have the following code, I could not manage to work it so far cause I do not know jquery well. Hope to give someone feedback
<head>
<script type="text/javascript" src="/scripts/datepicker.core.js"></script>
<script type="text/javascript" src="/scripts/datepicker.jquery.ui.min.js"></script>
<script type="text/javascript" src="/scripts/jquery.ui.datepicker-tr.js"></script>
<script type="text/javascript" src="/scripts/jquery.ui.datepicker-en-GB.js"></script>
</head>
<body>
<div id="LanguageSelector">
<form method="get" action="/"><select id="LanguageDropDownList" name="lang" onchange="javascript:location='/?lang=' + this.options[this.selectedIndex].value" ><option value="en" selected="selected" >English (en)</option><option value="tr">Türkçe (tr)</option></select><noscript><input type="submit" value=">"></noscript></form>
</div>
<div class="calendar" id="datepicker"></div>
<script type="text/javascript">
var initialCalendar = true;
$(function() {
$.datepicker.setDefaults( $.datepicker.regional[ ' ' ] );
var eventDays = [<%=dateOfEvent%>];
$('#datepicker').datepicker($.datepicker.regional[ 'tr' ],
{
inline: true,
dateFormat: 'yy-mm-dd',
changeMonth: true,
changeYear: true,
onSelect: function(date) {
if(!initialCalendar){
for(var i in eventDays){
if(eventDays[i].Date == date){
window.location = eventDays[i].Url;
}
}
}else{
initialCalendar = false;
}
},
beforeShowDay: function(thedate) {
thedate = thedate.format("yyyy-MM-dd");
for(var i in eventDays){
if(eventDays[i].Date == thedate){
return [true,""];
}
}
return [false, ""];
}
});
$( '#LanguageDropDownList' ).change(function() {
$( '#datepicker' ).datepicker( "option",
$.datepicker.regional[ $( this ).val() ] );
});
});
Date.prototype.format = function(format)
{
var o = {
"M+" : this.getMonth()+1,
"d+" : this.getDate(),
"h+" : this.getHours(),
"m+" : this.getMinutes(),
"s+" : this.getSeconds(),
"q+" : Math.floor((this.getMonth()+3)/3),
"S" : this.getMilliseconds()
}
if(/(y+)/.test(format)) format=format.replace(RegExp.$1,
(this.getFullYear()+"").substr(4 - RegExp.$1.length));
for(var k in o)if(new RegExp("("+ k +")").test(format))
format = format.replace(RegExp.$1,
RegExp.$1.length==1 ? o[k] :
("00"+ o[k]).substr((""+ o[k]).length));
return format;
}
</script>
</body>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
它似乎也工作正常：http://jsfiddle.net/repw4/936/。
如果它仍然不起作用，请尝试销毁日期选择器并重新启动它：
查看它的实际效果： http://jsfiddle.net/repw4/936/
It seems to be working fine as well: http://jsfiddle.net/repw4/936/.
If it still doesn't work for you, try to destroy the datepicker and re-initiate it:
See it in action: http://jsfiddle.net/repw4/936/
调用“销毁”可能会删除一些事件（如果有）。尝试首先调用 'refresh' 方法，它将进行重绘：
Calling the 'destroy' could remove some events if any. Try calling the 'refresh' method first, it will do a redraw: