HTML5: dragover (), drop (): как получить текущие координаты x, y?

Question

Как определить координаты (x, y) при перетаскивании «dragover» и после удаления («drop») в HTML5 DnD?

Я нашел веб-страницу, описывающую x, y для dragover (посмотрите на e.offsetX и e.layerX, чтобы увидеть, установлены ли они для разных браузеров, но для меня они НЕ установлены).

Что вы используете для функции drop (e), чтобы узнать, ГДЕ в текущей цели сброса она была фактически отброшена?

Я пишу онлайн-приложение для проектирования схем, и у меня большой целевой объект.

Нужно ли переходить на уровень мыши, чтобы узнать x, y или HTML5 предоставляет абстракцию более высокого уровня?

Answer 1

Свойства clientX и clientY должны быть установлены (в современных браузерах):

function drag_over(event) {
    console.log(event.clientX);
    console.log(event.clientY);
    event.preventDefault();
    return false;
}
function drop(event) {
    console.log(event.clientX);
    console.log(event.clientY);
    event.preventDefault();
    return false;
}

Вот (несколько) практический пример , который работает в Firefox и Chrome.