如何將字符串變量格式化為具有特定格式的日期？

Question

我的案子需要幫助。 我是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”，則會顯示錯誤消息“無效日期”。

我只需要以“ mm / dd / yy”格式獲取tempValue，即使它以“ dd / mm / yy”格式獲取也是如此。

Answer 1

Javascript Date()需要幾種日期字符串格式 ...
但不是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> ;) 

Answer 2

所以最后我找到了解決方法...確切的問題出在用戶區域設置中，因此具有區域設置英語（初始化狀態）的用戶具有'M / d / yyyy'日期格式，因此我們需要編寫代碼來創建每個語言環境日期格式的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>

我認為這不是最佳解決方案，但是如果您對此有任何想法，請告訴我。

謝謝！