jQuery 1.6.2 bind больше не работает с событиями перетаскивания? - PullRequest
Новая
       41

jQuery 1.6.2 bind больше не работает с событиями перетаскивания?

1 голос
/ 24 августа 2011

Я пытаюсь использовать .bind() с 'dragenter', 'dragover' и 'drop', чтобы я мог перетащить файл со своего рабочего стола в браузер.

Пожалуйста, см. Прикрепленный файл jsfiddle.http://jsfiddle.net/v82An/23/

$(function(){
    function dragenter(e) {
        e.stopPropagation();
        e.preventDefault();
    }
    function dragover(e) {
        e.stopPropagation();
        e.preventDefault();
    }    
    function drop(e) {
        e.stopPropagation();
        e.preventDefault();        
        alert('hi')
    }

    $('#drop').bind('dragenter', dragenter, false);
    $('#drop').bind('dragover', dragover, false);
    $('#drop').bind('drop', drop, false);    
});

Эта скрипка правильно прикрепляет эти события в 1.5, но в 1.6 они просто не работают.

Кто-нибудь знает, если я просто делаю это неправильно?

Ответы [ 2 ]

6 голосов
/ 24 августа 2011

Кажется, работает, если вы не установите preventBubble на false: 

$('#drop').bind('dragenter', dragenter);
$('#drop').bind('dragover', dragover);
$('#drop').bind('drop', drop);

DEMO

Обновление: Если вы посмотрите документацию , передача трех параметров, где последний является логическим, интерпретируется как: 

.bind( eventType, [eventData], preventBubble )

, что означает, что обработчикиспользуется не как обработчик событий, а как данные событий.

Они изменили способ определения обработчика.В jQuery 1.5.2 это было: 

if ( jQuery.isFunction( data ) || data === false ) {
    fn = data;
    data = undefined;
}

Видите ли, когда вторым аргументом была функция, тогда этот использовался как обработчик события (вместо третьего).

Но в jQuery 1.6.2 оно было изменено на: 

if ( arguments.length === 2 || data === false ) {
    fn = data;
    data = undefined;
}

Теперь проверяется только количество передаваемых аргументов.Так как в вашем случае data не является false (это функция), и вы передаете три аргумента, fn не изменяется.Он остается false.

Когда обработчик равен false, , тогда это происходит : 

if ( handler === false ) {
    handler = returnFalse;
} else if ( !handler ) {
    // Fixes bug #7229. Fix recommended by jdalton
    return;
}

Так что это может фактически рассматриваться как ошибка в jQuery 1.5который теперь исправлен и не является проблемой с этими конкретными событиями.

0 голосов
/ 13 сентября 2014

Я обнаружил, что моя проблема заключается в том, что jQuery прославляет исходный объект события во время процесса связывания.

Мой код выглядел так: 

$dropArea = $(".dropArea");
$dropArea.bind({
    dragover: function (ev) {
        $(this).addClass('hover');
        ev.preventDefault();
        return false;
    },
    dragend: function () {
        $(this).removeClass('hover');
        return false;
    },
    dragleave: function () {
        $(this).removeClass('hover');
        return false;
    },
    drop: function (ev) {
        ev.preventDefault();
        //e = e || window.event;
        var data = ev.dataTransfer.getData("text/html");
        ev.target.appendChild(document.getElementById(data));

        console.log("dropping element.");
        return false;
    });

jQuery помещал старый объект события в более новую, более прославленную версию объекта события jQuery.

Я добавил эту строку: 

ev = ev.originalEvent;

, чтобы вернуть исходный объект события, после чего я мог бы вызвать warnDefault (), и все снова заработало.

Надеюсь, это поможет сэкономить время! (Я все еще обнимаю объекты jQuery и связанные с ними функции, поскольку они относятся к исходным объектам javascript).

...