Javascript мыши координаты и объявление DOCTYPE

Я хочу показать координаты мыши на странице, и когда я не объявляю DOCTYPE, это работает, но когда я объявляю DOCTYPE, это не так! Не могли бы вы помочь мне с этим? вот мой код:

<html>
<head>
    <title>problem</title>
</head>
<body>
    text...
<div id="show"></div>
<script>
    document.body.onmousemove = function(event) {
        document.body.innerHTML = "X: " + window.event.clientX + "<br />" + "Y: " + window.event.clientY;
    }
</script>
</body>
</html>

В приведенном выше коде я могу получить координаты y без проблем, но когда я добавляю тип документа, он не показывает координаты y правильно:

<DOCTYPE html>
<html>
<head>
    <title>problem</title>
</head>
<body>
    text...
<div id="show"></div>
<script>
    document.body.onmousemove = function(event) {
        document.body.innerHTML = "X: " + window.event.clientX + "<br />" + "Y: " + window.event.clientY;
    }
</script>
</body>
</html>

РЕДАКТИРОВАТЬ

Вот мой код, и теперь он отлично работает. Спасибо вам всем:

<!DOCTYPE html>
<html>
  <head>
    <title>problem</title>
  </head>
  <body>
    text...
    <div id="show"></div>
    <script>
    if (document.addEventListener) {
      document.addEventListener('mousemove', function(event) {
        document.body.innerHTML = "X: " + window.event.clientX + "<br />" + "Y: " + window.event.clientY;
      });
    } else {
      document.attachEvent("onmousemove", function(event) {
        document.body.innerHTML = "X: " + window.event.clientX + "<br />" + "Y: " + window.event.clientY;
      });

}
   </script>
  </body>
</html>

2 ответа

Решение

Попробуйте выполнить прослушивание события мыши с помощью обработчика событий, например:

<!DOCTYPE html>
<html>
  <head>
    <title>problem</title>
  </head>
  <body>
    text...
    <div id="show"></div>
    <script>
    document.addEventListener('mousemove', function(event) {
        document.body.innerHTML = "X: " + window.event.clientX + "<br />" + "Y: " + window.event.clientY;
    });
   </script>
  </body>
</html>

Во-первых, правильное объявление DOCTYPE написав <!DOCTYPE html> вместо <DOCTYPE html>,

Во-вторых, измените ваш скрипт на:

document.addEventListener('mousemove', function(event) {
    document.body.innerHTML = "X: " + event.clientX + "<br />" + "Y: " + event.clientY;
});

За параметры, передаваемые в функцию, можно обращаться напрямую, записывая window.event будет когда event будет ребенком window объект, другими словами, глобальный объект.

Другие вопросы по тегам