Как измерить время, затраченное на элемент с помощью мыши? - PullRequest
Новая
       90

Как измерить время, затраченное на элемент с помощью мыши?

0 голосов
/ 02 августа 2020

Я пытаюсь измерить количество времени, которое курсор провел на элементе с событиями наведения мыши. Я объединил фрагменты кода из других вопросов и получил следующий код: 

    <h1 id="demo" onmouseover="start()" onmouseout="stop()">Mouse over me</h1>
    
    <p>You've been over this sentence for <span id=seconds></span> seconds.</p>
    
    <script>
    function start() {
      window.setInterval((function(){
              var start = Date.now();
              var textNode = document.createTextNode('0');
              document.getElementById('seconds').appendChild(textNode);
              return function() {
                  textNode.data = Math.floor((Date.now()-start)/1000);
          }
       }()), 1000);
    }
    
    function stop() {
    }
    </script>

Однако в моем текущем коде есть несколько проблем. Во-первых, мне не удалось остановить таймер, когда мышь покидает текст. Я попытался заменить начальную переменную текущей разницей во времени, но это не сработало, вероятно, из-за второй проблемы: когда курсор уходит и возвращается, создается другой таймер вместо обновления существующего. В идеале мне также было бы интересно подсчитать, сколько раз мышь вводила и оставляла текст, на который были наведены события наведения курсора мыши.

...