JQuery перезапустить функцию переключения

Question

У меня есть функция пользовательских clickToggle

это делает

Закладки первого тумблер - открыть DIV вкладки второго переключателя - закрыть DIV

после 1 пуговицы, пользователь может также близко div, щелкнув вне div, не активируя toggle2. в следующий раз, когда я хочу открыть div, он будет продолжаться при 2-м переключении, что является плохой ошибкой.

Так что в основном я спрашиваю, есть ли в любом случае, я могу закончить/перезапустить функцию переключения на полпути, чтобы, если пользователь щелкнет вне div, в следующий раз, когда я нажму на вкладку, она начнется с 1-го переключения снова , вместо продолжения при 2-м переключении.

Есть ли что-то вроде сброса, который я могу сделать, чтобы перезапустить функцию переключения? Довольно отчаянный об этом день задумывался.

$(function() { 
    $("#toggle").clickToggle(function() { // toggle 1 open 
     $(".log").html("click Toggle1, show tab panel, isToggle = true"); 
     $("#toggle_content").animate({width:'toggle'},350); 
     $(".container").addClass("overlay-disable"); 

     // alternative exit(i want the toggle function to restart 
     // if this function runs, if not the next time i want to open the tab through 
     // toggle 1, it will continue at toggle 2 instead which is a bad bug as that 
     //was suppose to be a exit. 
     $(".container").click(function() { 
      $(".container").unbind("click").removeClass("overlay-disable"); 
      $(".log").html("panel hide success, isToggle = false"); 
      $("#toggle_content").hide(); 

     }); 
    },function() { // toggle 2 exit 
     $(".container").unbind("click").removeClass("overlay-disable"); 
     $(".log").html("click Toggle2, hide tab panel"); 
     $("#toggle_content").animate({width:'toggle'},350); 

    }); 
}); 

clickToggle является пользовательский плагин для переключения между 2-мя функциями в каждый раз, когда я нажимаю на вкладку, она работала гладко, только открытие и выход, но как только я добавил альтернативный выход я не могу получить разрешение на перезагрузку переключите функцию toggle1, если активирован альтернативный выход.

скрипку: http://jsfiddle.net/eekxzq1u/

, когда и нажмите на вкладку, это поп-серое поле, когда и нажмите на вкладку снова, это близко гладко. Но когда вы выберете вкладку, вы не будете работать плавно больше

Answer 1

Вы можете избежать использования плагина, выполнив простой подход с использованием состояния машины. Demo. Вы будете нуждаться в

1. массив функций, которые будут вызываться по нажатию states
2. Variable сохранить текущее состояние currentState
3. и обработчик для вызова функции государства по щелчку run

Код:

var states = [function() { // click button 1st toggle 
     $(".log").html("click Toggle1, show tab panel, isToggle = true"); 
     $("#toggle_content").animate({width:'toggle'},350); 
     $(".container").addClass("overlay-disable"); 
     currentState = 1; //change state 

     $(".container").click(function() { 
      $(".container").unbind("click").removeClass("overlay-disable"); 
      $(".log").html("panel hide success, isToggle = false"); 
      $("#toggle_content").hide(); 
      currentState = 0; //change state 
     }); 
    }, 
     function() { 
     $(".container").unbind("click").removeClass("overlay-disable"); 
     $(".log").html("click Toggle2, hide tab panel"); 
     $("#toggle_content").animate({width:'toggle'},350); 
      currentState = 0; //change state 

    }], 
    currentState = 0, 
    run = function() { 
     return states[currentState].apply(this, arguments);   
    }; 

$("#toggle").click(run);