Jquery freezing on show()

Question

Может кто-нибудь скажет мне, сошел я с ума или где я ошибаюсь. Я пробовал это в нескольких браузерах, и он зависает jQuery, когда вы показываете().

Я не могу понять это, я пробовал несколько способов скручивания кода, и независимо от того, когда вызывается .show(), он зависает и не будет работать, пока страница не будет перезагружена.

Цель состоит в том, чтобы показать несколько различных параметров, и если пользователь нажимает кнопку, и это платный вариант, он показывает требуемую дополнительную информацию. THE CRAZY THING - это когда вы удаляете большую часть файлов li, это прекрасно работает. НО, когда вы добавляете обратно li на страницу, это не работает. Он работает для 2 или 3 кликов, затем зависает. Firebug не показывает ошибок, просто ничего не делает. Интересно, что jquery на остальной части страницы все еще работает, когда часть опции заморожена. Я был бы признателен за любые конструктивные идеи. Благодаря!

НЕ РАБОТАЕТ joopk.com/signup РАБОТЫ /////////////////////////////////// ///////////

$(document).ready(function() { 
    $("#signupoptions .signupoption").click(clickedoption); 
}); 
function clickedoption() { 
    if ($(this).hasClass("payoption")) { 
    $("#signupadditionalinfo").show(); 
    }else { 
    $("#signupadditionalinfo").hide(); 
    } 
    $("#signupoptions .signupoption").removeClass("optionselected"); 
    $(this).addClass("optionselected"); 
} 

Я вынимаю детали для краткости, но общий HTML выглядит следующим образом:

<div id="signupoptions"> 
          <div id="signupoptiondescription"> 
           <ul> 
            <li>Joopk.com CMS</li> 
           </ul> 
          </div> 
          <div id="signupoptionsocial" class="signupoption optionselected"> 
           <h3> 
            Social</h3> 
           <ul> 
            <li class="check"></li> 
           </ul> 
          </div> 
          <div id="signupoptionbusiness" class="signupoption payoption"> 
           <h3> 
            Business</h3> 
           <ul> 
            <li class="check"></li> 
           </ul> 
          </div> 
          <div id="signupoptiondeveloper" class="signupoption payoption"> 
           <h3> 
            Developer</h3> 
           <ul> 
            <li class="check"></li> 
           </ul> 
          </div> 
          <div class="clear"> 
          </div> 
         </div> 
         <div id="signupadditionalinfo" class="container" style="display: none;"> 
          <h3> 
           Additional Information</h3> 

         </div> 

Answer 1

логика щелчок была отключена .. См. Мою скрипку: http://jsfiddle.net/sablefoste/3JMA9/1/

В принципе, взгляните на jQuery:

$(document).ready(function() { 
    $("#signupoptions .signupoption").click(function(){ 
     clickedoption($(this).attr('class')); 
    }); 
}); 

function clickedoption(myclass) { 
    if (myclass.indexOf("payoption") !== -1) { 
     $("#signupadditionalinfo").show(); 
    } else { 
     $("#signupadditionalinfo").hide(); 
    } 
    $("#signupoptions .signupoption").removeClass("optionselected"); 
    $(this).addClass("optionselected"); 
} 

CSS поможет вам понять, что происходит.