jQuery: jak symulować przeciąganie i upuszczanie kodu?

EDIT: oto link do pokazania mojego przykładowego kodu: http://www.singingeels.com/jqtest/

Mam bardzo prostą stronę, która odwołuje się do jquery-1.3.2.js, ui.rdzeń.js (najnowsza wersja) i ui.do ciągnięcia.js (także najnowsza wersja).

Mam div, który mogę bardzo łatwo przeciągnąć (oczywiście za pomocą myszki):

<div id="myDiv">hello</div>

A następnie w JavaScript:

$("#myDiv").draggable();
To działa idealnie. Ale muszę być w stanie symulować "przeciągnij i upuść" za pomocą samego kodu. I zazwyczaj działa, ale problem polega na tym,że uruchamiane zdarzenia są zdarzeniami zastępczymi .

Jeśli otworzysz " ui.rdzeń.js " i przewiń do dołu... zobaczysz to:

// These are placeholder methods, to be overriden by extending plugin
_mouseStart: function(event) { },
_mouseDrag: function(event) { },
_mouseStop: function(event) { },
_mouseCapture: function(event) { return true; }

Dlaczego zdarzenia nie są odpowiednio rozszerzane w mojej symulacji, ale kiedy klikasz myszką, są? - Wszelkie pomysły, jak zmusić _mousedrag: właściwość do posłuszeństwa nadrzędnego rozszerzenia w " ui.do ciągnięcia.js"?

Rozwiązanie tego byłoby ogromne - i planuję pokazać główne korzyści później.

Dzięki, - Tymoteusz

EDIT: oto link do pokazania mojego przykładowego kodu: http://www.singingeels.com/jqtest/

Edycja 2: kliknij powyższy link i view-source... zobaczysz, co próbuję zrobić. Oto fragment:

$(document).ready(function() {
    var myDiv = $("#myDiv");

    myDiv.draggable();

    // This will set enough properties to simulate valid mouse options.
    $.ui.mouse.options = $.ui.mouse.defaults;

    var divOffset = myDiv.offset();

    // This will simulate clicking down on the div - works mostly.
    $.ui.mouse._mouseDown({
        target: myDiv,
        pageX: divOffset.left,
        pageY: divOffset.top,
        which: 1,

        preventDefault: function() { }
    });
});
Author: SolutionYogi, 2009-07-22

3 answers

Jest pytanie na forum JQuery o to . Nie jest rozwiązany w momencie pisania, ale może mieć więcej informacji w przyszłości.


EDIT: odpowiedź na forum:

Zalecam użycie wtyczki simulate, która jest tym, czego jQuery UI używa do testowania jednostek przeciągnij i upuść:

Https://github.com/jquery/jquery-ui/blob/master/external/jquery-simulate/jquery.simulate.js

Możesz zobaczyć przykłady z użycia, patrząc na testy jednostkowe

Https://github.com/jquery/jquery-ui/blob/master/tests/unit/draggable/core.js

Https://github.com/jquery/jquery-ui/blob/master/tests/unit/draggable/events.js

Dzięki rdworthowi za to.

 29
Author: StuperUser,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-08-12 08:15:28

Znalazłem rozwiązanie, które działa całkiem dobrze. Mam wywołanie zdarzenia drop funkcji o nazwie onDragAndDrop(). Ta funkcja pobiera dwa argumenty, obiekt draggable jQuery i obiekt droppable jQuery.

$('.my-drop-target').droppable({
    drop: function(event, ui) {
        onDragAndDrop(ui.draggable, $(event.target));
    }
});

W moich testach mam funkcję, która bezpośrednio wywołuje onDragAndDrop, ale upewnia się, że użytkownik za pomocą myszy mógł wykonać tę akcję.

    var simulateDragAndDrop = function(draggable, droppable) {
        if (!draggable.data('uiDraggable')) {
            throw new Error('Tried to drag and drop but the source element is not draggable!');
        }
        if (!droppable.data('uiDroppable')) {
            throw new Error('Tried to drag and drop but the target element is not droppable!');
        }
        onDragAndDrop(draggable, droppable);
    }

Uznałem, że jest to ładne, łatwe w użyciu rozwiązanie do testów jednostkowych. Pewnie skończy mi się na używaniu klawiatury jako cóż.

 3
Author: Patrick McElhaney,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-10-02 22:21:00

Musisz pokazać kod, którego używasz do" symulowania " tego. Moim instynktem jest to, że będziesz musiał skonstruować odpowiednie zdarzenia DOM i je odpalić, ale nie wiem, czy jQuery ma możliwości wstrzykiwania sztucznych zdarzeń.

Możesz po prostu zadzwonić bezpośrednio do obsługi zdarzeń?

 -1
Author: Mark Renouf,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-07-22 16:14:36