SlideUp JQuery не работает

Question

У меня проблема с 'slideUp' из jquery.

После «slideDown» я скрываю открытую кнопку, и я показываю ее в другом div. Это должно закрыть ВОткрытьполе

HTML

<div class="ciao"> 
    <div id="cerca"><input type="text" /></div> 
     <div id="flip"><a href="#">button</a></div> 
     <div id="panel"> 
      <ul><li>menu 1 </li><li>menu 2 </li><li>menu 3 </li></ul> 
     </div> 
     </div> 

JS

 $("#flip a").click(function(){ 
     $(this).hide(); 
     $("#panel").slideDown("slow"); 
     $('#flip').animate({top:'30px'}); 
     $('#cerca').append('<a href="#" id="close">CHIUDI</a>'); 
    }); 

    $("#cerca a#close").click(function(){ 
     $(this).parent('#panel').slideUp("slow"); 
    }); 

JSFIDDLE http://jsfiddle.net/rttoorop/

Answer 1

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

$("#cerca").on('click','a#close',function(){ 
    $(this).parent().siblings('#panel').slideUp("slow"); 
}); 

Working Demo

Answer 2

Вы связывание события 'нажмите' для элемента, который не существует.

Answer 3

Вам необходимо метод делегирования событий для динамически созданного элемента on method:

$(document).on('click',"#cerca a#close",function(){ 
     $(this).parent('#panel').slideUp("slow"); 
    }); 

I've answered more about event delegation method here