Событие ondragstart больше не запускается в Internet Explorer 9 - PullRequest
Новая
       24

Событие ondragstart больше не запускается в Internet Explorer 9

2 голосов
/ 07 июля 2011

Я реализовал HTML5 перетаскивание на DIV. Он прекрасно работает во всех браузерах, включая IE8. Но с тех пор, как IE9 был выпущен, он больше не работает. Событие ondragstart не запускается. Вот мой код, использующий jQuery: 

$('#mydiv')
   .bind('selectstart', function(e) {
        // Prevent text selection
        return false;
    })
    .bind('dragstart', function(e) {
        console.log('dragstart');
    })
    .bind('drag', function(e) {
        console.log('drag');
    })
    .bind('dragend', function(e) {
        console.log('dragend');
    });

и HTML 

<div draggable="true">DnD this thing!</div>

1 Ответ

6 голосов
/ 08 июля 2011

Держу пари, что это не сработало в IE8, потому что ни IE8, ни IE9 не полностью поддерживают перетаскивание HTML5, это было добавлено только в IE10 Developer Preview 2 .HTML5 API основан на реализации перетаскивания в IE5, но есть некоторые различия.Наиболее уместно, что IE9 и ранее не поддерживают атрибут draggable для элементов - в IE9 можно перетаскивать только те вещи, которые можно перетаскивать по умолчанию: выбор текста, ссылки и изображения.

чтобы работать в IE9 (или IE8), вам нужно добавить ссылку в ваш HTML (и эта ссылка должна иметь href): 

<div id="mydiv"><a draggable="true" href="#">DnD this thing!</a></div>

Ваш JavaScript должен работать, как и ожидалось, с небольшимимодификации: 

$('#mydiv')
   .bind('selectstart', function(e) {
        // Prevent text selection
        return false;
    })
    .bind('dragstart', function(e) {
        e.originalEvent.dataTransfer.setData("Text", $(e.target).closest('div').attr('id'));
        console.log('dragstart');
    })
    .bind('drag', function(e) {
        console.log('drag');
    })
    .bind('dragend', function(e) {
        console.log('dragend');
    })
    .bind('click', function(e) {
        return false;
    });

Вот пример, который я тестировал в Firefox и IE9 .

...