javascript date object issue in Safari and IE

问题:

I am taking a date from a JSON object in the format of 2012-12-31 and trying to convert it into friendly values and output it.

    var redeemableDate = item.Deal.RedeemableDate; //this is coming in the form of 2012-12-31
    var redeemableDate = new Date(redeemableDate);
    var rdDay = weekday[redeemableDate.getDay()]; //using an array with weekdays
    var rdDate = redeemableDate.getDate();
    var rdMonth = monthNames[redeemableDate.getMonth()]; //using an array with month names
    var rdYear = redeemableDate.getFullYear();

    response.write('Valid ' + rdDay + ' ' + rdDate + ' ' + rdMonth + ' ' + rdYear + ' ONLY');

It all works find and dandy in Firefox and Chrome, but Safari and IE (only tested on IE8 so far) don't like it.

In FF and Chrome I get the expected:

Valid Sunday 2 September 2012 ONLY

But in Safari and IE, I get:

Valid undefined NaN undefined NaN ONLY

When I alert redeemableDate after I have set it as a Date object, Safari returns 'Invalid Date' and IE returns 'NaN'. This is obviously where the issue lies. Is there a way I can get my value into a date object for these browsers?

回答1:

The yyyy-mm-dd (ISO 8601) date format is not supported in Safari and IE. It is part of ECMAscript 5 though, so it should be just a matter of time.

A solution would be to pass the date in as arguments to Date.

var date = "2012-12-31".split("-");
var your_date = new Date(date[0], date[1]-1, date[2]);

Note that month parameter starts at zero (for January), so you must subtract 1 from the value obtained from the string.

EDIT: For a shortcut see answer by joe larson below.

回答2:

You're better off parsing the date string yourself:

function dateFromISO( str ) {
  var d = null;
  str.replace(/^(\d\d\d\d)-(\d\d)-(\d\d)$/, function(_, y, m, d) {
    d = new Date(parseInt(y, 10), parseInt(m, 10) - 1, parseInt(d, 10));
  });
  return d;
}

redeemableDate = dateFromISO( redeemableDate );

Even if the other browsers liked those date strings, you'd have the problem of them always being interpreted as UTC. For me, for example, when I pass that string "2012-12-31" to Firefox, it tells me that the date is 30 Dec 2012, because I'm 6 hours behind UTC. In other words, "2012-12-31" is interpreted as midnight of that date, UTC time. Assuming you want everybody in the world to see the right date, if you construct the Date object with numbers it's assumed to be local time at the client.

回答3:

Combining jacks and joe larson's response, the following code worked well for me:

        $scope.formatDate = function(date){
                var date = date.split("-").join("/");
                var dateOut = new Date(date);
                return dateOut;
        }; 

works well for Chrome and Safari... :)
Thanks Jack and joe larson!!!

回答4:

Older Internet Explorer versions (and apparently your version of Safari) won't parse a yyyy-mm-dd string, such as new Date('2012-12-31').

Another option is jQuery.datepicker.parseDate(), although that may be a bit overkill.

回答5:

In the case of using a PHP web service, I would recommend returning your dates using $row['date'] = date('j/n/Y',strtotime($row['date'])); to have normal functionality with safari/ie.