jQuery UI DatePicker输出日期格式

本文介绍了jQuery UI DatePicker输出日期格式的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 我有内联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事件处理程序第一个参数是选择的日期作为文本。 我猜想这将在初始化时被指定格式化

请参阅 jqueryui/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 jqueryui/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