Spojrzałem na post przez Remy Sharp i zaimplementowałem podstawowy przykład w Ember.js, zobacz http://jsfiddle.net/pangratz666/DYnNH/.
Kierownice:
<script type="text/x-handlebars" >
Drag and drop the green and red box onto the blue one ...
{{view App.Box class="box green"}}
{{view App.Box class="box red"}}
{{view App.DropTarget class="box blue"}}
</script>
JavaScript:
DragNDrop = Ember.Namespace.create();
DragNDrop.cancel = function(event) {
event.preventDefault();
return false;
};
DragNDrop.Dragable = Ember.Mixin.create({
attributeBindings: 'draggable',
draggable: 'true',
dragStart: function(event) {
var dataTransfer = event.originalEvent.dataTransfer;
dataTransfer.setData('Text', this.get('elementId'));
}
});
DragNDrop.Droppable = Ember.Mixin.create({
dragEnter: DragNDrop.cancel,
dragOver: DragNDrop.cancel,
drop: function(event) {
var viewId = event.originalEvent.dataTransfer.getData('Text');
Ember.View.views[viewId].destroy();
event.preventDefault();
return false;
}
});
App.Box = Ember.View.extend(DragNDrop.Dragable);
App.DropTarget = Ember.View.extend(DragNDrop.Droppable);
To wygląda obiecująco, a podobne do tego, co mam w mojej aplikacji. Ale tak naprawdę nie będzie obsługiwać przeglądarek, które nie obsługują atrybutów HTML5, które można przeciągnąć i zrzucić, co jest moim celem. Oczywiście jestem najbardziej zainteresowany wsparciem IE :) –
Hmm, wygląda na to, że jest obsługiwany w IE, zobacz http://caniuse.com/#feat=dragndrop ... – pangratz
czy mógłbyś zaktualizować swoje skrzypce za pomocą jquery 1.7? Wygląda na to, że został uszkodzony przy użyciu krawędzi jQuery. –