Перехват вызовов событий JavaScript (добавьте прослушиватель событий, чтобы всегда вызываться первым или альтернативно) - PullRequest
1 голос
/ 03 февраля 2011

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

Моей первоначальной мыслью было связать мой прослушиватель событий, который определяет, должны ли все остальные прослушиватели событий для этого элемента запускаться, как первый прослушиватель событий в цепочке. Изучив это - это кажется невозможным (по крайней мере, с моей комбинацией способов, которыми слушатели событий связаны с элементом).

Для обеспечения некоторого контекста:

У меня есть список пунктов на веб-странице. Когда пользователь нажимает одну из этих «ссылок на элементы», другая область страницы заполняется формой, где пользователь может затем изменить некоторые свойства элемента. Чтобы свойства измененного элемента были сохранены, пользователь должен нажать кнопку «Обновить», которая относится к форме.

Моя цель - убедиться, что если пользователь изменяет свойство элемента, не нажимая «Обновить», а затем нажимает на другую «ссылку на элемент», он должен подтвердить, что он рад игнорировать только что сделанные изменения.

Моя попытка решения:

  1. Свяжите прослушиватель события изменения со всеми элементами формы, для которых для поля JavaScript hasChanges установлено значение true.
  2. Добавьте класс ко всем «ссылкам на элементы», который идентифицирует их как ссылки, которые приведут к потере пользователем изменений.
  3. Используя jQuery, связывайте прослушиватели событий click и keypress со всеми элементами этого класса, чтобы отобразить всплывающее окно подтверждения, если значение hasChanges равно true.
  4. Если пользователь желает сохранить свои изменения, нажмите кнопку «Отмена», чтобы остановить распространение события.

Проблема заключается в том, что элементы 'item links' уже имеют (Java) Spring AJAX художественное оформление прослушиватель события click, чтобы обновить раздел страницы, который позволяет пользователю изменять свойства элемента, и это всегда вызывается перед слушателем события, который отображает подтверждение. На самом деле, я не думаю, что смогу связать прослушиватель событий для подтверждения перед обработкой AJAX, чтобы убедиться, что подтверждение отображается перед обновлением раздела формы свойств элемента на странице.

У кого-нибудь есть предложения?

Заранее спасибо.

Обновление:

Предлагаемое решение состояло в том, чтобы установить флаг 'caputre' в true. Итак, мой код, который добавляет прослушиватель событий к «ссылкам на элементы», теперь выглядит так:

$("." + linkClassName).each(function()
{
    if ($.browser.msie)
    {
        this.setCapture(true);
        this.attachEvent("onclick", _self.linksFunction);
    }
    else
    {
        this.addEventListener("click", _self.linksFunction, true);
    }
});

Однако, добавив протоколирование (в консоль FF) для всех функций, вызываемых по щелчку «ссылки на элемент», моя функция «linksFunction» по-прежнему вызывается последней. Я сделал что-то не так?

Спасибо.

1 Ответ

0 голосов
/ 03 февраля 2011

Используйте addEventListener с capture, установленным в true.

Читать все об этом здесь: https://developer.mozilla.org/en/DOM/element.addEventListener

Обновление:

Если требуется поддержка IE, использовать setCapture .
Он поддерживает только события мыши, но, насколько я могу судить, это все, что вам нужно.

Обновите снова:

Извините, я был слишком быстр, использовать захват - бесполезный ответ, поскольку он не решит вашу проблему.

Единственный способ сделать то, что вы хотите, - использовать глобальное делегирование кликов. Таким образом, у вас будет единственная точка, через которую пройдут все ваши события клика, и вы сможете контролировать события там.

Есть несколько недостатков этого решения, которые могут вам не понравиться. Одним из очевидных является то, что вы можете забыть о нормальном всплытии событий, поскольку делегирование основано на последнем шаге в фазе всплытия. другое - вам придется прикреплять события совершенно иначе, чем вы привыкли.

Тем не менее, если вы можете с этим смириться, это может быть фантастическим способом обработки событий кликов, который я предпочел использовать в течение последних нескольких лет сам. В итоге вы получаете только одно событие клика, зарегистрированное на всей вашей странице (на document.body), и затем вы строите крошечный каркас вокруг событий связывания / открепления с селекторами css и ручного запуска при необходимости.

Некоторым преимуществом этого метода является то, что вы можете регистрировать события щелчка до того, как элементы будут существовать, поскольку вы не регистрируете их на самих элементах, что хорошо, если вы создаете сайт на лету, используя, например, шаблоны на стороне клиента ,

...