显示文本字段时,ISO字符串的时间转换不正确

时间:2015-10-22 20:24:54

标签: javascript date datepicker

我在MVC应用程序中有一个显示日期和时间的文本字段。日期是使用日期选择器和我添加到文本字段的时间创建的。 该案文的一个例子如下:

10/23/2015 12:00 AM

我想用ISO 8601格式创建一个Date对象。该日期将用于在fullcalendar jquery插件中创建一个事件。 当我尝试创建Date对象时,ISO字符串是:

2015-10-23T04:00:00.000Z

当天午夜应该是2015-10-23T00:00:00.000Z。 这是我的代码:

<label id="schedule_start_date_lbl">Start Date: </label>
<input id="schedule_start_date" type="text" />

var startDayIndex = getDayIndex($('#rotation_start_time_txt').val());
$("#schedule_start_date").datepicker({
    minDate: 0,
    beforeShowDay: function (date) { return [date.getDay() == startDayIndex, ""] },
    onSelect: function (dateText) {
        $('#schedule_end_date').datepicker('option', 'minDate', dateText);
    },
    onClose: function (selectedDate) {           
        var rotation_txt = $('#rotation_start_time_txt').val();
        var time = rotation_txt.substr(rotation_txt.indexOf(',') + 1);
        $(this).val(selectedDate + time.toString(' HH:mm tt').toString());
    }
});

    $("#rotation_schedule_btn").click(function () {
//text value in schedule_start_date is: 10/23/2015 12:00 AM
 var startDate = new Date($('#schedule_start_date').val()).toISOString();
 //Value displayed is 2015-10-23T04:00:00.000Z
 alert('startDate: ' + startDate);
});

为什么时间值会减少4小时? 感谢

更新 我需要在创建Date对象后添加它们。使用下面的答案中的函数创建Date对象不是以UTC格式创建它。它可以显示格式,但是当我在fullcalendar控件中创建事件时,日期必须为UTC格式,而不是。 这是我创建计划的功能:

 $("#rotation_schedule_btn").click(function () {
    //create member list order    
    var memberList = [];         
    $("#rotationList li").each(function () {
        memberList.push({
            id: $(this).attr('id'),
            name: $(this).text(),
            color: $(this).css('background-color')
        })
    });

    //start and end date and time for new schedule
    var startDate = convertTextToDate($('#schedule_start_date').val())
    var endDate = convertTextToDate($('#schedule_end_date').val());

    //remove events between startDate & endDate
    $('#edit_calendar').fullCalendar('removeEvents', function (event) {
        if (event.start.toDate() >= startDate && event.start.toDate() <= endDate
               || event.end.toDate() >= startDate && event.end.toDate() <= endDate) {
            return true;
        }
    });

    //Create events from rotation schedule selected
    var newEvents = [];
    var rotation_length = $('#rotation_type_select option:selected').val();
    var rotation_start_date = new Date(startDate.toISOString());
    var rotation_end_date = new Date(startDate.toISOString());

    //End date is to midnight
    endDate.setMinutes(endDate.getMinutes() + 1);
    rotation_end_date.setDate(rotation_end_date.getDate() + parseInt(rotation_length));

    var member_index = 0;
    while (rotation_end_date <= endDate)
    {
   //     alert('start date: ' + rotation_start_date.toISOString() + ' end date: ' + rotation_end_date.toISOString());
        var event = new Object();
        event = {
            title: memberList[member_index].name,
            start: new Date (rotation_start_date.toISOString()),
            end: new Date (rotation_end_date.toISOString()),
            objectID: memberList[member_index].id,
            color: memberList[member_index].color,
            allDay: true,
            textColor: 'white'
        };
        newEvents.push(event);
        eventsAdded.push(event);

        rotation_start_date.setDate(rotation_start_date.getDate() + parseInt(rotation_length));
        rotation_end_date.setDate(rotation_end_date.getDate() + parseInt(rotation_length));

        if ((memberList.length - 1) == member_index) {
            member_index = 0;
        }
        else {
            member_index++;
        }
    }           
    //Render events on calendar
     $('#edit_calendar').fullCalendar('addEventSource', newEvents);
    }); //end create schedule button click

转换日期的功能与下面相同,但我重命名了函数:

function convertTextToDate(dateValue)
{   
    var dateArray = dateValue.split(/\D/);
    var pm = /pm$/i.test(dateValue);
    var hour = (+dateArray[3] || 0) % 12 + (pm ? 12 : 0);
    var date = new Date(Date.UTC(dateArray[2], dateArray[0] - 1, dateArray[1], hour, +dateArray[4] || 0, +dateArray[5] || 0));
    return date;
}

我做错了什么?

2 个答案:

答案 0 :(得分:0)

Date.prototype.toISOString()基于0偏移UTC时区。因此,它试图将您当前的时区规范化为0 UTC,因为当您执行new Date()时,您会根据当前时区创建一个新日期,这就是该方法尝试将您的日期恢复为UTC时间的原因区。您现在可能正处于UTC之后4小时的时区。

http://devdocs.io/javascript/global_objects/date/toisostring

为了解决这个问题,只需在&#34;附加你的字符串; UTC&#34;它将不再进行时区转换:

10/23/2015 12:00 AM UTC

它将生成:

"2015-10-23T00:00:00.000Z"

答案 1 :(得分:0)

不要使用Date构造函数来解析字符串,尤其是非标准字符串。永远。手动解析字符串。

由于您拥有固定格式,因此可以非常直接地创建基于UTC的日期,其格式为OP

// Parse date format mm/dd/yyyy hh:mm:ss AP as UTC
function parseMDYA(s) {
  var b = s.split(/\D/);
  var pm = /pm$/i.test(s);
  var h = (+b[3]||0)%12 + (pm? 12 : 0);
  return new Date(Date.UTC(b[2], b[0]-1, b[1], h, +b[4]||0, +b[5]||0));
}

var s = '10/23/2015 12:00 AM';
var d = parseMDYA(s);
document.write('Input string: ' + s +
               '<br>UTC time: ' + d.toISOString() +
               '<br>Local time: ' + d
               );

未提供的时间部分被视为0。