jquery - Jquery 的 FadeIn 和 FadeOut 问题

Question

我已经为弹出显示编写了 html 代码，当我单击按钮时我可以看到弹出窗口(淡入)，但是当将 jquery 写入淡出时。单击按钮淡入后，弹出窗口没有得到显示 谁能帮帮我。 查询:

<script
  src="https://code.jquery.com/jquery-3.2.1.js"
  integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE="
  crossorigin="anonymous"></script>
        <script>
           $(document).ready(function(){
             $("#alert-btn").click(function(){
                 $(".container").fadeIn('slow');
             });  
               $(".container").on('click',function(){
                 if(event.target).is('#btn-cancel'){
                     $(".container").fadeOut('slow');
                 }       
               }); 


           });
        </script>

演示在这里:

https://jsfiddle.net/VijayVj7/osv98wew/

Answer 1

你不能这样做:if(event.target).is('#btn-cancel')

试试这个:

$(document).ready(function(){
             $("#alert-btn").click(function(){
                 $(".container").fadeIn('slow');
             });  

             $(".container #btn-cancel").on('click',function(){
                 $(".container").fadeOut('slow'); 
               });          

           });

https://jsfiddle.net/osv98wew/1/