Функция внутри события щелчка требует 2 щелчка, чтобы вызвать

Question

У меня есть ссылка a с id #searchBoxPop2. После его щелчка, я хочу вызвать функцию #searchBoxPop2.toggle. Моя проблема в том, что я должен дважды щелкнуть по ссылке для переключения. Можете ли вы, ребята, помочь этому грязному сценарию? Большое спасибо

$('#searchBoxPop2').live('click', function() { 
     if (!$('.header-wrapper-home').length) { 
      $('div.right-block').show(); 

       $('#searchBoxPop2').toggle(
       function() { 
       $('.detail-page-content').animate({ 
        marginTop: "+=290px" 
       }, 800) 
      }, 
       function() { 
       $('.detail-page-content').animate({ 
        marginTop: "0px" 
       }, 800); 
      }); 
     } 
     if ($('.header-wrapper-home').length) { 
      $('.header-wrapper-home').slideToggle('slow'); 

     } 
    }); 

Пожалуйста, дайте мне знать, если вы хотите, чтобы я объяснить остальную часть кода и то, что я собираюсь делать в Detial.

Answer 1

Как я сказал в комментарии, toggle event function был устаревшим в jQuery 1.9. Таким образом, вам нужно использовать свой собственный метод для альтернативных вызовов. Сначала меня раздражало, что встроенной альтернативы не существует, но этот метод более краток. Тем более, что, как только у вас есть формат вниз, его легко реплицировать на любой другой вызов события.

Вот быстрая и грязная функция обратного вызова, которую я только что написал. Есть, вероятно, более эффективные способы достижения этого, но это хорошая отправная точка:

function() { 
    var number = 2; // the number of events you toggle through 
    if (! window.toggle_counter) 
     window.toggle_counter = 0; 
    switch (window.toggle_counter) { 
     case 0: 
      // do some things 
      break; 
     case 1: 
      // do other things 
      break; 
     // etc .. 
    } 
    window.toggle_counter = (window.toggle_counter + 1) % number; 
} 

Имейте в виду, что window.variable_name является глобальный масштаб, так что будьте осторожны конфликтов.