1

The following code is working perfectly fine in all browsers except for safari. safari is showing me this weird nand nanh nanm nans instead of ticking timer. 

$( document ).ready(function() {
    var specialDate = "<?php echo trim(date('Y-m-d\TH:i:s',strtotime($time[1])));?>";
    var countDownDate = new Date(specialDate).getTime();

    var x = setInterval(function() {
    var now = new Date().getTime();

    var distance =   countDownDate -  now;
    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);

    document.getElementById("buy_<?php echo $key; ?>").innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s ";

}, 1000);
///////////////// Buy Now End//////////////////

    });

When I checked the console it show me following error on this line

Uncaught TypeError: Cannot set property 'innerHTML' of null

document.getElementById("buy_<?php echo $key; ?>").innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s ";

enter image description here

P.S Although all browsers except for safari are showing me days hours minutes seconds countdown fine but if I check console in any browser it is also showing me the same above mentioned error. any help here ?

EDIT:: here is the full screen of console. enter image description here

Muhammad Asif Raza
  • 647
  • 2
  • 5
  • 24
  • Are you sure you it is allowed to use tag in javascript? Seems pretty weird to me :/ – Arnaud Rochez Nov 08 '17 at 17:00
  • @ArnaudRochez yes is rendering properly as you can see I have edited my questeion and atttached full screenshot of the console – Muhammad Asif Raza Nov 08 '17 at 17:06
  • I guess that it is interpreted correctly by all the browsers except safari because they are "smarter", but that it still is an incorrect way of using javascript, not sure tho but I personally never saw this syntax :/ – Arnaud Rochez Nov 08 '17 at 17:10
  • I see you are using JQuery, you might want to try $("#buy_").html("...") – Arnaud Rochez Nov 08 '17 at 17:12
  • Do you actually have an element with id `buy_1`? Also that is not the Safari web inspector, that's Chrome's? – jcaron Nov 08 '17 at 17:18
  • Which version of Safari are you using? Some versions were quite picky when providing them a date string (the format you provide, though accepted by most browsers, is not a standard format for a date). – jcaron Nov 08 '17 at 17:20
  • @ArnaudRochez yes but the problem is still there. the is properly matching with the container i am printing the counter in. but still no success on safari.. :( – Muhammad Asif Raza Nov 08 '17 at 17:21
  • @jcaron absolutely yes, coz if I dont then I would not be seeing this working in other browsers. I checked the source in safari and this buy_1 exists with uniqueness – Muhammad Asif Raza Nov 08 '17 at 17:22
  • @jcaron its v 5.1.7 (7634.57.2) – Muhammad Asif Raza Nov 08 '17 at 17:24
  • Is it in the source HTML from the start, or is it added via JS afterwards? If the latter, it's just a matter of the interval function being fired before the element is created, and doesn't affect things. – jcaron Nov 08 '17 at 17:25
  • Wow that's a reeeeeally old version of Safari. You'll probably have to change the date format. The best option is to provide the date as components individually. Otherwise add 'Z' at the end to make it a valid ISO 8601 date, but it needs to be UTC, not local time. Or just provide the Unix timestamp directly and multiply by 1000. – jcaron Nov 08 '17 at 17:26

1 Answers1

0

"Uncaught TypeError: Cannot set property 'innerHTML' of null".

looks like it can't found your id:("buy_<?php echo $key; ?>") are you sure your html has a object with the name buy_1.

Fcmarv
  • 5
  • 5