2012-06-05 2 views
0

У меня действительно странная проблема. Мой пример кода работает [здесь] [1] тихо, но у меня точно такой же код в редакторе студии aptana, и когда я пытаюсь использовать его в браузере Chrome или Eclipse, события просто не срабатывают. Я не могу себе представить, что это проблема, потому что это точно такой же код ...JQuery mouse events не срабатывает

HTML

<!DOCTYPE html> 
<html> 
    <head> 
     <title>OrderScreen</title> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
     <script src="js/script.js" type="text/javascript"></script> 
    </head> 
    <body> 
       <a href="">Test</a> 
    </body> 
</html> 

JQuery

$("a").mouseup(function() { 
    clearTimeout(pressTimer); 
    // Clear timeout 
    return false; 
}).mousedown(function() { 
    // Set timeout 
    pressTimer = window.setTimeout(function() { 
     alert("hcbdhaf") 
    }, 1000); 
    return false; 
}).click(function() { 
    alert("dfsdg"); 
}); 
+0

- это ваши события выше в '$ (document) .ready (function() {});' ?? –

+0

отлично работает для меня: http://jsfiddle.net/6sWVX/1/ –

+0

@HunterMcMillen: Да. Обратите внимание, что ссылка OP во втором предложении также является ссылкой на jsFiddle. Твоя работа по той же причине, что и у него: настройки jsFiddle по умолчанию скрывают эту конкретную ошибку. –

ответ

5

Если ваш код действительно, как указано, проблема в том, что элементы не существуют, когда вы пытаетесь связать обработчики событий с ними. Настройки jsFiddle по умолчанию скрывают эту проблему от вас. (Посмотрите налево, и вы увидите, что ваш код не будет работать не до load пожаров событий   —, который очень, очень поздно в процессе загрузки страницы.)

Чтобы исправить это, либо:

  1. Переместите теги скриптов в конец вашего документа непосредственно перед или после закрытия тега </body>. Когда браузер запустит ваш скрипт, элементы будут существовать. Это recommendation of the YUI team и веб-инженеры Google like it too.

  2. Используйте событие jQuery's ready.

В сочетании с любым из этих вариантов вы также можете посмотреть на использование делегирования событий вместо прямого подключения событий к элементам. Ваши обработчики mouseup и mousedown будут прикреплены к каждыйa элемент индивидуально. Это много подключений. Если есть контейнер, в котором находятся все те элементы a (body или еще что-то ближе), вы можете вместо этого перехватить событие на этом контейнере (с тех пор, как эти пузырьки событий), а затем проверить, произошло ли событие в элементе a , jQuery поддерживает делегирование делегирования, выполняя большую часть тяжелой работы для вас, через delegate (что мне нравится, потому что оно настолько явное), а совсем недавно один из полдюжины вариантов аргументов, которые вы передаете on.

+0

'$ (function() {...})' Извините, я увлеченный стенографией –

+0

@KyleMacey. Был ли отредактирован ответ? Я вообще не понимаю ваш комментарий. – gdoron

+0

@gdoron: Он имеет в виду мое упоминание о событии 'ready'. Он предпочитает сокращенное обозначение, которое должно передать функцию в функцию 'jQuery' (' $ '). –