[jquery][зарядка для ума] время между наведением и кликом по ссылке

Тема в разделе "JavaScript", создана пользователем dig555, 16 фев 2012.

Модераторы: ZiX
  1. dig555

    dig555

    Регистр.:
    22 июн 2007
    Сообщения:
    363
    Симпатии:
    148
    Народ! Вышел тут спор относительно размера (физического) анкора и местоположения ссылок на сайте. Нужно выяснить одну вещь применительно к конкретным ссылкам, конкретного сайта. Обратите внимание, что когда вы кликаете по ссылкам, сам клик представляет собой два действия (наведение на ссылку и собственно клик). Стоит задача узнать значение среднего промежутка времени между этими двумя действиями (полагаю - десятые секунды) на конкретном сайте.

    Задачка:

    Есть ссылка <a href="http://bla-bla-bla" id="gourl">Ссылка</a>
    При наведении ( hover) мыши на ссылку ('#gourl') нужно запустить таймер,
    а при нажатии (click) его остановить. Сколько натикало и нужно узнать. Это значение нужно передать в POST запросе скрипту count.php. В нём будет обработчик поступающей информации (сохранение, вычисление среднего значения).

    Помогите JQuery скриптом. К фрилансерам с такой задачкой идти в лом, а у самого что-то не получается ни с таймером, ни с AJAX.
     
  2. dino

    dino

    Регистр.:
    28 май 2009
    Сообщения:
    550
    Симпатии:
    204
    Зачем таймер то запускать? Метка времени при наведении на ссылку - метка времени при клике = искомая разница... Остальное дело техники...
     
  3. dig555

    dig555

    Регистр.:
    22 июн 2007
    Сообщения:
    363
    Симпатии:
    148
    Ок. Как получить метку времени? Или имеется в виду - 1). навели - отправили запрос 2). кликнули - отправили запрос. Скрипт-обработчик, на основании этих данных и выдаст нужное? Или как?
     
  4. displey

    displey Писатель

    Регистр.:
    5 фев 2009
    Сообщения:
    6
    Симпатии:
    4
    Так же проще.
     
  5. SkiLLer

    SkiLLer

    Регистр.:
    22 авг 2007
    Сообщения:
    307
    Симпатии:
    64
    можно прямо в JS получить метки времени
    Код:
    time = new Date();
    var time1 = time.getTime(); // onHover
    var time2 = time.getTime(); //onClick
    
    вот как-то приблизительно так
     
    latteo и dig555 нравится это.
  6. Viodele

    Viodele Механик

    Administrator
    Регистр.:
    17 дек 2011
    Сообщения:
    110
    Симпатии:
    479
    HTML:
    <!DOCTYPE html>
    <html>
        <head>
            <title>Some kind of a test page which was created by not exactly sober programmer in a depressed mood and for a search of the truth</title>
         
            <script src="js/jquery.js" type="text/javascript"></script>
            <script type="text/javascript">
                var time_holder = 0;
             
                $(document).ready(function () {
                 
                    /**
                    * Линк в фокусе
                    */
                    $('#my_anchor').mouseover(function () {
                        time_holder = new Date().getTime();
                    });
                 
                    /**
                    * Линк вне фокуса
                    */
                    $('#my_anchor').mouseout(function () {
                        time_holder = 0;
                    });
                 
                    $('#my_anchor').click(function () {
                        time_holder = new Date().getTime() - time_holder;
                     
                        /**
                        * Если вылетит ошибка - юзверь все ровно попадет на нужную страницу, ибо
                        * в данном методе вылет exception или false - недопустимы(так как блокируют переход).
                        */
                        try {
                            $.ajax({
                                type: 'POST',
                                url: 'http://some-domain.com/count.php',
                                data: 'delay=' + time_holder,
                                success: function(){
                                    /**
                                    * В принципе, на сколько я понимаю задачу, тут пофиг на возвращаемый результат. Все ровно
                                    * браузер по всей видимости уже успеет редиректнуться.
                                    */
                                    return;
                                }
                            });
                        } catch (e) { }
                     
                        time_holder = 0;
                        return;
                    });
                });
            </script>
        </head>
        <body>
            <a href="https://nulled.cc" id="my_anchor">I Like Nulled!</a>
        </body>
    </html>
    Так не вариант?
     
    latteo и dig555 нравится это.
  7. Viodele

    Viodele Механик

    Administrator
    Регистр.:
    17 дек 2011
    Сообщения:
    110
    Симпатии:
    479
    Да, правда, результат будет в миллисекундах.
     
    dig555 нравится это.
  8. dig555

    dig555

    Регистр.:
    22 июн 2007
    Сообщения:
    363
    Симпатии:
    148
    Viodele. Огромное спасибо. Судя по коду - то, что нужно. Сейчас обработчик сделаю и проверю. (А кстати, если после
    time_holder = new Date().getTime() - time_holder;
    alert(time_holder); воткнуть то показывать будет время?
    Или в JS нужно как-то var в string переводить?
     
  9. Viodele

    Viodele Механик

    Administrator
    Регистр.:
    17 дек 2011
    Сообщения:
    110
    Симпатии:
    479
    Код:
    alert('> ' + time_holder);
    Это самый простой "перевод". Да, следует учесть, что данный пример работает только для левой кнопки мыши. Для остальных - по необходимости дописать...
     
    dig555 нравится это.
  10. dino

    dino

    Регистр.:
    28 май 2009
    Сообщения:
    550
    Симпатии:
    204
    Для примера обработчик наведения на ссылку и момента нажатия на ссылку (при желании можно еще и момент когда отпустили кнопку мышки отследить) с алертом всех событий:
    Код:
    <script language="javascript">
    $(function(){
    $("a").mouseover(function(){
    window.overtime= new Date().getTime();
    alert(overtime);
    }).mousedown(function(){
    var downtime= new Date().getTime();
    var r= downtime-overtime;
    alert(downtime+"-"+overtime+"="+r);
    });
    });
    </script>
    </head>
    <body>
    <a href='#' >ssylka</a>
    </body>
    
     
    dig555 нравится это.