Как заставить clientX и clientY работать внутри моего обработчика событий перетаскивания в Firefox?

Mozilla firefox 3.x, похоже, имеет ошибку при прослушивании события «ondrag». Объект события не сообщает о положении перетаскиваемого объекта, clientX, clientY и другие смещения экрана установлены равными нулю. Это довольно проблематично, так как я хотел создать прокси-элемент на основе перетаскиваемого элемента и, конечно же, использовать clientX и clientY для настройки его положения.

Я знаю, что есть классные вещи, такие как setDragImage в HTML5, но я хочу предоставить общую абстракцию для родного DD между браузерами.

Неверный код:

document.addEventListener('drag', function(e) {
    console.log(e.clientX); // always Zero
}, false);

Примечание. Эта проблема не возникает при других событиях (dragstart, dragover), и события mousemove не могут быть захвачены при перетаскивании чего-либо.

Пожалуйста помоги !


javascript events drag-and-drop firefox-3
person Christophe Eblé    schedule 20.05.2009    source источник
comment
+1 за комментарий, который вы оставили. Вы можете использовать ответ, предоставленный Хосе. Я также постараюсь узнать что-нибудь связанное с этим, как только у меня будет время.   -  person Kirtan    schedule 20.05.2009
comment
Я нашел решение, я поместил прослушиватель на событие перетаскивания на уровне документа, теперь я получаю правильные свойства X и Y, которые я могу предоставить через глобально общий объект.   -  person Christophe Eblé    schedule 20.05.2009
comment
Та же ошибка (на мой взгляд) присутствует в Firefox 10. То же самое касается pageX и других свойств координат. Если он не должен быть частью этого события, он должен быть неопределенным, а не нулевым, верно? Это очень раздражает. Сожалеем, что вам приходится использовать событие dragover в качестве хака, но, по крайней мере, это работает.   -  person Chris Bosco    schedule 09.03.2012

Ответы (3)


arrow_upward
16
arrow_downward

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

person Christophe Eblé    schedule 23.05.2009

arrow_upward
4
arrow_downward

Событие перетаскивания в HTML 5 не полностью функционально в современных браузерах. Чтобы имитировать ситуацию перетаскивания, вы должны использовать:

  1. Добавьте событие onmousedown, установив var true.
  2. Добавьте событие onmouseup, установив для этого var значение false.
  3. Добавьте событие onmousemove, проверяя, является ли эта переменная истинной, и если это так, переместите свой div в соответствии с координатами.

Это всегда работало для меня. Если у вас возникнут какие-либо проблемы, свяжитесь с нами снова, я могу привести несколько примеров.

удачи!

person José Leal    schedule 20.05.2009

arrow_upward
0
arrow_downward

Я знаю, что есть классные вещи, такие как setDragImage в HTML5, но я хочу предоставить общую абстракцию для родного DD между браузерами.

Но зачем делать что-то подобное, разве нет таких библиотек, как JQuery & Прототип доступен для кросс-браузерного перетаскивания?

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

Это сэкономит много времени.

person Kirtan    schedule 20.05.2009
comment
JQuery и Prototype просто обеспечивают симуляцию D&D, а это не то, что мне нужно, родной DD намного надежнее и быстрее, чем любое другое симулированное решение. - person Christophe Eblé; 20.05.2009