jQuery UI DatePicker输出日期格式 [英] jQuery UI DatePicker output date format

问题描述

我有内联jQuery UI DatePicker，需要自定义格式和输出日期，代码：

 < div id =date-start>< / div> 
< div class =date startid =date-start-output>< / div> 
 
 $（function（）{
 // Datepicker 
 $（'＃date-start'）。datepicker（{
 inline：true，
 showOtherMonths：true，
 altField：＃date-start-value，
 altFormat：dd M yy，
 dateFormat：dd M yy，
 onSelect：function （）{
 var day1 = $（＃date-start）。datepicker（'getDate'）。getDate（）; 
 var month1 = $（＃date-start 'getDate'）getMonth（）+ 1; 
 var year1 = $（＃date-start）。datepicker（'getDate'）。getFullYear（）; 
 var str_output =& ;+ day1 +< / b>< span>+ month1 +< br />+ year1 +< / span>; 
 $（'＃date-start-输出'）。html（str_output）; 
} 
 
}）; 
 
}）; 
  

它有效，但在＃date-start-output中，我的日期格式不是dd M yy 而是dd m yy。如何设置月份必需的输出格式？
此外，我需要在页面加载后的＃date-start-output当前日期中显示，我正在尝试beforeShow事件，但不能与onSelect事件一起工作。

谢谢。

解决方案

onSelect事件处理程序第一个参数是选择的日期作为文本。
我猜想这将在初始化时被指定格式化

请参阅 http://jqueryui.com/demos/datepicker/#event-onSelect

  $（function（）{
 // Datepicker 
 $（'＃date-start'）。datepicker（{
 inline：true，
 showOtherMonths：true，
 altField：＃date-start-value，
 altFormat：dd M yy，
 dateFormat：dd M yy，
 onSelect：function（dateText）{
 $（'＃date-start-output'）。html（dateText）; 
} 
}）; 
}）; 
  

如果您需要特殊格式，您可以尝试：

{pre> $（function（）{
// Datepicker
$（'＃date-start'）。datepicker（{
...
onSelect：function（）{
var dateText = $ .datepicker.formatDate（< b> dd< / b>< span> M< br /> yy< / span> $（this）.datepicker（getDate））;
$（'＃date-start-output'）.html（dateText）;
}
}）;
}）;


不确定它会使用HTML标签，但

I have inline jQuery UI DatePicker and need to customize format and look of output date, code:

<div id="date-start"></div>
<div class="date start" id="date-start-output"></div>

$(function(){
    // Datepicker
    $('#date-start').datepicker({
        inline:true,            
        showOtherMonths: true,
        altField: "#date-start-value",
        altFormat: "dd M yy",
        dateFormat: "dd M yy",
        onSelect: function(){
            var day1 = $("#date-start").datepicker('getDate').getDate();                 
            var month1 = $("#date-start").datepicker('getDate').getMonth() + 1;             
            var year1 = $("#date-start").datepicker('getDate').getFullYear();               
            var str_output = "<b>" + day1 + "</b><span>" + month1 + "<br />" + year1 + "</span>";
            $('#date-start-output').html(str_output);
        }

    }); 

});

It works, but in #date-start-output I have date format not as "dd M yy" but as "dd m yy". How can set necessary output format for month? Also I need to show in #date-start-output current date after page load, I'm trying "beforeShow" event, but it not work together with "onSelect" event for me.

Thanks.

解决方案

onSelect event handler first parameter is the selected date as text. I guess it would be formatted as specified during the initialization

See http://jqueryui.com/demos/datepicker/#event-onSelect

$(function(){
    // Datepicker
    $('#date-start').datepicker({
        inline:true,            
        showOtherMonths: true,
        altField: "#date-start-value",
        altFormat: "dd M yy",
        dateFormat: "dd M yy",
        onSelect: function(dateText){
            $('#date-start-output').html(dateText);
        }
    }); 
});

If you need special formatting, you can try:

$(function(){
    // Datepicker
    $('#date-start').datepicker({
        ...
        onSelect: function(){
            var dateText = $.datepicker.formatDate("<b>dd</b><span>M<br />yy</span>", $(this).datepicker("getDate"));
            $('#date-start-output').html(dateText);
        }
    }); 
});

Not sure it will work with HTML tags though

这篇关于jQuery UI DatePicker输出日期格式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！