javascript:单击按钮时淡入淡出，然后单击第二个按钮淡出？

Question

有人可以帮助我尝试让 div 在用户单击按钮/div 时淡入吗？ 然后在第二次点击时我希望 div 再次淡出，我希望这个脚本重复/重复。

这是我用来淡化 div 的方法:

<script>

    $('.submit_review').click(function () {
        if ($('.submit_review').is(":visible")) {
             $('.review_submit_box').delay(400).fadeIn(300);




        }
    });
</script>

这是我试图让它在单击按钮时淡入和淡出的方法，但我需要朝正确的方向插入，谢谢。

<script>

    $('.submit_review').click(function () {
        if ($('.submit_review').is(":visible")) {
             $('.review_submit_box').delay(400).fadeIn(300);

        } else if ( $('.submit_review').click(function () {
         $('.review_submit_box').is(":visible")) {
            $('.review_submit_box').fadeOut(300);



        }
    });
</script>

html:

<div class="reviews_section">
<div class="submit_review"><div class="
submit_review_text">Submit a Review</div></div>
<div class="review_submit_box"></div>
</div>
<div class="reviews_section2">
<?php include('includes/mod_profile/mod_reviews/mod_reviews.php'); ?>

</div>

Answer 1

为什么不简单地使用 jQuery 的 fadeToggle http://api.jquery.com/fadeToggle/

您可以在点击时切换淡入/淡出，这会将您的代码减少到几行

编辑: 这是一些代码

$('.submit_review').click(function() {
  $('.review_submit_box').fadeToggle(300)
})