2016-10-19 108 views
0

我需要我的帮助。我是JS新手。 我从当前页面获取值(10/19/2016)并尝试创建Date对象。 但是如果日期是(19/10/2016)它给了我一个NaN页面。 我需要这种格式的东西(MyVar,“dd/mm/yy”)在任何时候变量。如何做到这一点,我真的被困在这。如何将字符串变量格式化为特定格式的日期?

<link href="{!$Resource.fullCalendarCSS}" rel="stylesheet" /> 
<link href="{!$Resource.fullCalendarPrintCSS}" rel="stylesheet" media="print" /> 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 
<script src="//code.jquery.com/jquery-1.8.3.js"></script> 
<script src="//code.jquery.com/ui/1.9.2/jquery-ui.js"></script> 

<script src="{!$Resource.JqueryDateFormatJS}"></script> 
<script src="{!$Resource.JqueryDateFormatMinJS}"></script> 
<script src="{!$Resource.DateFormatJS}"></script> 
<script src="{!$Resource.DateFormatMinJS}"></script> 
<script src="{!$Resource.fullCalendarMinJS}"></script> 

<script type='text/javascript'> 

    $.noConflict(); 
    jQuery(document).ready(function() { 
     tempValue = '{!$CurrentPage.parameters.startDate}'; 



     newDate1 = $.datepicker.formatDate("mm/dd/yy", new Date(tempValue)); 
     console.log(newDate1); 
     newDate = new Date(newDate1); 
     console.log(newDate); 



     d = newDate.getDate(); 
     m = newDate.getMonth(); 
     y = newDate.getFullYear();   

    //We need to wrap everything in a doc.ready function so that the code fires after the DOM is loaded 
    //Call the fullCallendar method. You can replace the '#calendar' with the ID of the dom element where you want the calendar to go. 
     jQuery('#calendar').fullCalendar({ 
      year: y, 
      month: m, 
      date: d,             
      defaultView: 'agendaDay', 
      slotMinutes: 15, 
      header: { 
       left: 'prev,next today', 
       center: 'title', 
       right: 'month,agendaWeek,agendaDay' 
      }, 
      editable: false, 
      events: 
      [ 
       //At run time, this APEX Repeat will reneder the array elements for the events array 
       <apex:repeat value="{!events}" var="e"> 
        { 
         title: "{!e.title}", 
         start: '{!e.startString}', 
         end: '{!e.endString}', 
         url: '{!e.url}', 
         allDay: {!e.allDay}, 
         className: '{!e.className}', 
        }, 
       </apex:repeat> 
      ] 
     });   
    });  
</script> 

我正在使用fullCalendar和DateFormat插件。

如果我的格式变量tempValue “MM/DD/YY” 我可以定义日期对象等:

date = new Date(tempVal) ----> Thu Oct 20 2016 00:00:00 GMT+0300 (Russia TZ 2 Standard Time) 

并且如果VY变量将在格式 “DD/MM/YY” 它给我第一个错误“无效的日期”。

即使格式为“dd/mm/yy”,我也只需要以“mm/dd/yy”格式获取tempValue。

+0

[Parse DateTime string in JavaScript]可能的副本(http://stackoverflow.com/questions/1576753/parse-datetime-string-in-javascript) –

+0

无论如何,对于FullCallendar,OP需要日期部分分割。 –

回答

0

Javascript Date()预计a couple date string formats ...
但不是dd/mm/yyyy。

你注意到了。

因此,既然您已经从日期选择器中获得了正确的日期,那么为什么不简单地使用.split来检索零件呢?

如果您想对日期执行计算,例如查找两个日期之间的差异,请使用这些分割的部分将正确的格式传递给Date()

// Commented out because we don't have this value here in this snippet. 
 
//tempValue = '{!$CurrentPage.parameters.startDate}'; 
 

 
// I used this date value instead... 
 
tempValue = "24/09/2016"; 
 

 
console.log(tempValue); 
 

 
//newDate1 = $.datepicker.formatDate("mm/dd/yy", new Date(tempValue)); 
 
//console.log(newDate1); 
 
//newDate = new Date(newDate1); 
 

 
// Get the splitted values 
 
var dateTemp = tempValue.split("/"); 
 

 
d = dateTemp[0]; 
 
m = dateTemp[1]; 
 
y = dateTemp[2]; 
 

 
console.log("d: " + d); 
 
console.log("m: " + m); 
 
console.log("y: " + y); 
 

 
// To perform calculations, you'll need this. 
 
calcDate1 = new Date(m + "/" + d + "/" + y); 
 
console.log(calcDate1.toString());
Just run the snippet and check the console...<br> 
 
;)

+0

你也可以使用这个非常简单和流行的库http://momentjs.com/ – gsalisi

+0

@Louys感谢您的回答! – Viktor

+0

@Louys,它没有解决我的问题(变量tempValue可能是“24/10/2016”或“10/24/2016”,所以如果广告变量将是24新日期会给我一个错误“无效日“,我需要格式化为”mm/dd/yy“格式的任何日期格式,我该怎么做? – Viktor

0

所以最后我已经找到了解决办法... 确切的问题在用户区域,所以与区域英语(Inited州)的用户有一个“M/d/yyyy'日期格式,所以我们需要编写代码为每个Locale日期格式创建Date对象。

最后:

<script type='text/javascript'> 

    $.noConflict(); 
    jQuery(document).ready(function() { 

     tempValue = '{!$CurrentPage.parameters.startDate}'; 

     var userLang = UserContext.dateFormat; 
     var dateTemp = tempValue.split("/"); 

     d1 = dateTemp[0]; 
     m1 = dateTemp[1]; 
     y1 = dateTemp[2]; 

     y=''; 
     d=''; 
     m='';  

     console.log(userLang);  

     if (userLang === "M/d/yyyy") {       

      newDate = new Date(d1 + "/" + m1 + "/" + y1); 
      d = newDate.getDate(); 
      m = newDate.getMonth(); 
      y = newDate.getFullYear();                        
     }; 

     if (userLang === "dd/MM/yyyy") {       

      newDate = new Date(m1 + "/" + d1 + "/" + y1); 
      d = newDate.getDate(); 
      m = newDate.getMonth(); 
      y = newDate.getFullYear();                        
     };    


    //We need to wrap everything in a doc.ready function so that the code fires after the DOM is loaded 
    //Call the fullCallendar method. You can replace the '#calendar' with the ID of the dom element where you want the calendar to go. 
     jQuery('#calendar').fullCalendar({ 
      year: y, 
      month: m, 
      date: d,             
      defaultView: 'agendaDay', 
      slotMinutes: 15, 
      header: { 
       left: 'prev,next today', 
       center: 'title', 
       right: 'month,agendaWeek,agendaDay' 
      }, 
      editable: false, 
      events: 
      [ 
       //At run time, this APEX Repeat will reneder the array elements for the events array 
       <apex:repeat value="{!events}" var="e"> 
        { 
         title: "{!e.title}", 
         start: '{!e.startString}', 
         end: '{!e.endString}', 
         url: '{!e.url}', 
         allDay: {!e.allDay}, 
         className: '{!e.className}', 
        }, 
       </apex:repeat> 
      ] 
     });   
    });  
</script> 

我觉得这是不是最好的解决方案,但如果你有一些想法是,请告诉我。

谢谢!

相关问题