блокировка одной вкладки в сортируемой вкладке jQuery

Question

Я создаю сортируемую вкладку в jQuery UI, но хочу заблокировать последнюю вкладку.Я уже сдвинул его вправо, но все еще можно отсортировать.Что мне нужно сделать, чтобы заблокировать последнюю добавленную вкладку?

Answer 1

Официально вы можете указать в сортируемом подпунктах, которые вы хотите сортировать, просто установите свойство items для селектора.

Хотя сортировка отключается при перемещении других вкладок (то есть отключенная вкладка никогда не перемещается), ее все равно можно перетаскивать. Чтобы обойти эту проблему, просто привяжите функцию к событию mousedown элемента и вызовите stopPropagation(), чтобы предотвратить перетаскивание.

См. Этот пример jsfiddle: http://jsfiddle.net/wZ4c6/1/

$('#tabs').tabs().find('.ui-tabs-nav').sortable({
    axis: 'x',
    items: '> li:not(.locked)' //This will prevent sortables to move around the locked item
});

$('button').button().click(function(){
    // Lock last tab
    $('#tabs > ul > li:last').addClass('locked').mousedown(function(event){
        event.stopPropagation();
    });

    // Refresh sortable items
    $('#tabs').find('.ui-tabs-nav').sortable('refresh');
});