javascript - SlideUp Jquery 不起作用

Question

我对 jquery 中的“slideUp”有疑问。

在“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

您需要使用事件委托(delegate)将事件附加到动态创建的元素上。您还需要将选择器修改为 id panel 的目标元素:

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

<强> Working Demo