javascript - slideUp 在 slideToggle 中的 fontawesome 图标上

Question

我做了一个图像框，当你点击它时，一个文本框会随着 slideToggle 效果向下滑动。当我再次单击该框以关闭文本框时，slideToggle 起作用。 但是当文本向下滑动时，我在文本框中放置了一个 fa-angle-up fontawesome 图标，这样访问者就可以关闭文本框，而不必再次按下图像框。这是我的 fiddle . 现在我似乎无法弄清楚如何使 fa-angle-up 图标工作。

如果我需要提供更多信息，我当然很乐意提供帮助。

我试过这段代码，但没有任何反应:

     (function($) { 
  $('.popup_trigger').on('click', function(e, ui) {
    $('.popup_community', $(this).parent('.wrapper_community')).slideToggle('slow');    
    e.preventDefault(); 
  });   
  $('.fa-angle-up').on('click', function(e, ui) {
    $('.popup_community', $(this).parent('.wrapper_community')).slideUp('slow');    
    e.preventDefault(); 
  });   

})(jQuery);

Answer 1

一个解决方案是添加一个 on click 函数来切换回之前的状态，例如:

$("i.fa").on("click", function () {
    $(this).parents(".popup_community").slideToggle('slow');
});

fiddle

引用资料

parents()