3

是否可以手动触发 jQuery 可排序控件的sortstop事件？

我已经尝试过$(selector).trigger('sortstop')，但似乎没有任何反应。

一些相关的 HTML：

<div data-zone="name">
    <div class="section disabled" id="section-1">Some section template 1</div>
    <div class="section" id="section-2">Some section template 2</div>
    <div class="section" id="section-3">Some section template 3</div>
</div>

<button class="trigger-button">Trigger stop</button>

和一些 JavaScript：

$("[data-zone]").sortable({
    placeholder: 'ui-state-highlight',
    cancel : ".section.disabled",
    stop: function(){
       console.log('sort-stopped');        
    }
})

$(".trigger-button").click(function(){
    console.log('trigger-button clicked');
    var $zone = $('[data-zone]');
    console.log($zone);
    $zone.trigger('sortstop');
});

JsFiddle的问题。

4

1 回答 1

0

Events are used by jQuery UI to notify your code that something has happened with their code, not the other way around.

You should be looking for methods that you can use to control the sortable object rather than trying to control ui elements by triggering events:

// Are you looking for this?
$( ".selector" ).sortable( "cancel" );

// Or this?
$( ".selector" ).sortable( "enable" );
$( ".selector" ).sortable( "disable" );

There is also no "sortstop" event. There is a "stop" event and a "beforeStop" event that sortables trigger when sorting is finished or about to finish, but these are sent out by the sortable object, not read by the sortable object in order to perform actions.

If what you really wanted was to listen for these events so you could perform some actions, then this is what you might want to do:

$("[data-zone]").on('stop', function(evt, ui) {
    // sortable has notified that it has stopped, do stuff here
});

More info can be found on the jQuery UI documentation for sortable:

http://api.jqueryui.com/sortable/

Also, here is the sortable.js source file on github

https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.sortable.js

于 2013-12-20T17:00:25.350 回答