скрипт больше не обновляет страницу

#javascript #html

#javascript #HTML

Вопрос:

У меня есть следующая HTML-страница, которая отображает изображение в случайном месте и обновляет его каждые 10 секунд :

 <!DOCTYPE html>
<html>
<head>
<title>Domoos | Screen saver screen</title>
<meta http-equiv="refresh" content="10">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>
<meta http-equiv="pragma" content="no-cache">
<link rel="stylesheet" type="text/css" href="css/mystyle_saver.css" />
<script type="text/javascript" src="scripts/date_time.js"></script>
<script type="text/javascript">
    function init() {
    var xmin = 0;
    var xmax = 890;
    var ymin = 0;
    var ymax = 430;
    var xCoord = Math.floor((Math.random()*xmax) xmin);
    var yCoord = Math.floor((Math.random()*ymax) ymin);
    var xCoordStr = xCoord.toString()   "px";
    var yCoordStr = yCoord.toString()   "px";
    document.getElementById("randomPlacement").style.left = xCoordStr;
    document.getElementById("randomPlacement").style.top = yCoordStr;
}
</script>
</head>
<body onload="init();">
<div style="position:absolute" id="randomPlacement">
<p><a href="index.html"><img src="assets/pictures/texte_sortie_veille.png" alt ="" style="width:60px;height:60px;"></a></p>
</div>
</body>
</html>

Это работает очень хорошо. Теперь я хотел бы добавить два тега ‘div’, чтобы я мог отображать дату и время. Итак, я обновил тег body следующим образом (остальная часть страницы остается неизменной) :

 <body onload="init();">
 <div style="position:absolute" id="randomPlacement">
 <p><a href="index.html"><img src="assets/pictures/texte_sortie_veille.png" alt ="" style="width:60px;height:60px;"></a></p>
</div>
<div id="date">
    <script type="text/javascript">window.onload = getDate('date');</script>
</div>
<div id="time">
    <script type="text/javascript">window.onload = getTime('time');</script>
</div>
</body>

Проблема при этом заключается в том, что изображение никогда не отображается в случайном месте. Чего мне не хватает и, надеюсь, как я могу решить проблему? Я добавил фрагмент консоли в Chrome.

Большое спасибо за вашу помощь.

1. Вы проверяли консоль JavaScript?

2. На что мне следует обратить внимание?

3. В Chrome щелкните правой кнопкой мыши на странице и выберите Проверить. Затем перейдите на вторую вкладку (с именем «Консоль») в открывшемся окне. В Firefox это элемент проверки> Консоль. Он покажет ошибки JavaScript на вашей странице.

4. Вы вызываете window.onload, который является событием для всего окна. таким образом, onload =»init();» не работает в нужное время. Я думаю, вам следует вызвать getdate() и gettime() в init()

5. Спасибо, Кабир Рой, я следовал твоим инструкциям. Но файл журнала кажется пустым. Возможно ли это?

Ответ №1:

заменить

   <div id="date">
    <script type="text/javascript">window.onload = getDate('date');</script>
</div>
<div id="time">
    <script type="text/javascript">window.onload = getTime('time');</script>
</div>

 <div id="time">

</div>

затем в init()

  function init() {
        var xmin = 0;
        var xmax = 890;
        var ymin = 0;
        var ymax = 430;
        var xCoord = Math.floor((Math.random()*xmax) xmin);
        var yCoord = Math.floor((Math.random()*ymax) ymin);
        var xCoordStr = xCoord.toString()   "px";
        var yCoordStr = yCoord.toString()   "px";
        document.getElementById("randomPlacement").style.left = xCoordStr;
        document.getElementById("randomPlacement").style.top = yCoordStr;
        document.getElementById("date").innerhtml=getDate('date');
document.getElementById("time").innerhtml=gettime('time');
    }