使用.trigger（）进行jQuery UI拖放

I'm trying to 'trigger' a drag and drop manually without the interaction of a mouse/user.

我试图在没有鼠标/用户交互的情况下手动“触发”拖放。

So far I have been able to setup the jQuery UI demo for drag and drop but unable to trigger the drag and drop using the trigger() method.

到目前为止,我已经能够设置用于拖放的jQuery UI演示,但无法使用trigger()方法触发拖放。

Can anyone help with setting this up?

有人可以帮忙设置它吗?

My code so far is:

到目前为止我的代码是:

  $(function() {
      $( "#draggable" ).draggable();
      $( "#droppable" ).droppable({
      drop: function( event, ui ) {
        $( this )
        .addClass( "ui-state-highlight" )
        .find( "p" )
        .html( "Dropped!" );
      }
    });

    $('#draggable').trigger("drop", $('#droppable'));
  });

Thanks in advance!

提前致谢!

To make things simpler. All I want to be able to do is call the 'drop' method from anywhere outside of the droppable() but I will always need to be able to specify the event and ui objects.

使事情变得简单。我想要做的就是从droppable()之外的任何地方调用'drop'方法,但我总是需要能够指定事件和ui对象。

2 个解决方案

#1

Why not to create a custom event trigered by the drop? So you can trigger it yourself:

为什么不创建一个由drop放弃的自定义事件?所以你可以自己触发它:

$(function(){
    $( "#draggable" ).draggable();
    $( "#droppable" ).droppable({
        drop: function( event, ui ) {
            $(this).trigger("customEvent", ui);
        }
    });
    $( "#droppable" ).bind("customEvent", function(event, ui ){         
        $( this )
                .find( "p" )
                    .html( "Dropped!");
    });  
   $( "#droppable" ).trigger("customEvent", $( "#draggable" ));  
});

#2

I think what you want is:

我想你想要的是:

$('#droppable').trigger('drop', $('#draggable'));

But even then, I wonder if the draggable element will make its way to the droppable as what got dropped...

但即便如此,我还是想知道可拖动的元素是否会因为被丢弃而放入droppable ...

#1