как предотвратить создание очереди кликов, используя переключатель в jquery? пробовал использовать bind/unbind('click')

Как уже упоминалось, ваша реализация вложения событий нарушена. Кроме того, в jQuery есть метод .stop, который освобождает вас от необходимости использовать привязку/развязку.

$("#button").click(function(){
    $(this).next().stop().toggle("slow");
});

Все, что он делает, это очищает очередь анимации и останавливает текущую анимацию, позволяя запустить следующую.

Функция остановки в документах jQuery. Обратите внимание, что у нее есть два свойства — clearQueue и goToEnd. Узнайте больше о более надежном использовании этого метода.

Во-первых, то, как вы прикрепляете события, нарушено. Я не знаю, это просто поспешность в вопросе или реальная ошибка в вашем коде, но вот правильный способ установить ваш обработчик:

$("#button").click(function(evt) { // <- you need to pass it a function!
    $(this).unbind('click').next()
       .toggle("slow",function(){$('#button').bind('click')});
});

Но на вашу проблему. Я думаю, вам будет полезно использовать функцию one jQuery. Как только обработчик кликов вызывается, он удаляется как обработчик кликов; поэтому он выполняется только один раз для одного клика. Чтобы снова включить обработчик кликов после анимации, я думаю, вы правильно поняли; повторно привяжите его после завершения анимации.

function clickHandler(evt) {
    $(this).next().toggle("slow",
        function() {
            $('#button').bind('click', clickHandler);
        });
}

$("#button").one('click', clickHandler);

Если использование one для вас слишком медленное, самым быстрым способом будет добавить javascript прямо на href якоря. Но вам нужно будет переключить глобальную логическую переменную, когда вы будете готовы выполнить снова.

<a href="javascript:clickHandler(); return false;">...</a>

function clickHandler() {
    if( someBoolean ) {
        someBoolean = false;
        //do stuff
    }
    someBoolean = true;
}

1-й метод

Отменить клики по событиям во время анимации переключателя:

$("#button").click(function(e) {

    e.stopPropagation();

    if ( $(this).next().is(':animated') ) {
        return false;
    }

    $(this).next().toggle("slow");
});

Посмотреть демо

2-й метод

Установите временную задержку, чтобы срабатывал только последний щелчок:

var timeID;

$("#button").click(function(e) {

    var $el = $(this);

    clearTimeout(timeID);

    timeID = setTimeout(function() {
        $el.next().toggle("slow");
    }, 250);    

});

Посмотреть демо

Вместо того чтобы игнорировать последующие клики, вы можете извлечь пользу из метода stop(). См. Совет: предотвращение образования очереди анимации для примера. Он говорит о hover, но это относится ко всему, что вы, вероятно, будете запускать анимации одну за другой для одного и того же события.

В качестве альтернативы вы можете отключить кнопку, а не удалять весь обработчик кликов? Вероятно, это лучше выражает намерение «больше не нажимать на меня», чем отказ от кликов.

есть проблема с методом переключения jquery, когда пользователь быстро нажимает на элемент переключения, это иногда дает неверный результат. это происходит из-за timesecond события click, когда первое событие не полностью завершено, второй триггер события создает проблему. решение этого немного сложно, но легко с помощью функции settimeout:

    $('.navbar-toggle').on('click', function() {
    $('.mob-logo').toggle();
    $('.navbar-toggle').css('pointer-events', 'none');

    setTimeout(function() {
    // enable click after 0.5second
    $('.navbar-toggle').css('pointer-events', 'all');
    }, 500); // 1 second delay
    });