为什么Safari / Opera无法与此JavaScript代码一起使用？

Question

I am working on a calendar that will show bookings. The height of containing the booking is calculated dynamically in proportion to the length of the booking. The following code works perfectly well in Firefox but not in Safari or Opera:

function calculateBookingHeight(from, to) {
    var today = new Date;
    var end = new Date.UTC(today.getUTCFullYear(),today.getUTCMonth(),today.getUTCDate(),23);
    var start = new Date.UTC(today.getUTCFullYear(),today.getUTCMonth(),today.getUTCDate(),6);
    var from = new Date(from);
    var to = new Date(to);
    if (from > start && to < end) {
        var difference = (to - from) / 120000;
    } else if (from > start && to > end) {
        var difference = (end - from) / 120000;
    } else {
        var difference = 510
    }
    return difference;
}

In summary, each hour on the calendar is a height of 30px. The second if statement deals with the end of the booking being the following day.

If I replace the entire code block with return 510 , Safari behaves as expected and sets the height of each booking to 510px so I assume it must be something in this function that is causing the problem.

Any help would be appreciated.

Thanks

Robin

Answer 1

One of your problems is that

var end = new Date.UTC(today.getUTCFullYear(),today.getUTCMonth(),today.getUTCDate(),23);
var start = new Date.UTC(today.getUTCFullYear(),today.getUTCMonth(),today.getUTCDate(),6);

should be

var end = new Date(today.getUTCFullYear(),today.getUTCMonth(),today.getUTCDate(),23);
var start = new Date(today.getUTCFullYear(),today.getUTCMonth(),today.getUTCDate(),6);

In other words, UTC is a getter method, which is why you were getting an object. To construct a date with those arguments, just pass them to the constructor.

Using

var end = today ; 
end.setUTCHours(23) ;

would be more straightforward.

Answer 2

http://www.w3schools.com/js/js_obj_date.asp

Describes creation of a javascript date object with four constructors:

new Date() // current date and time
new Date(milliseconds) //milliseconds since 1970/01/01
new Date(dateString)
new Date(year, month, day, hours, minutes, seconds, milliseconds)

Your invocation without parens isn't valid js, as Luis points out.

Answer 3

Figured it out. The dates weren't being created properly from the variables passed into the function. I needed to separately parse the input before creating the dates.