如果单击按钮时特定“div”为“display:block”，父“div”如何淡出？

Question

I have a question. I use the mail subscription service of 'mailchimp'. I'm changing the style after inserting the basic subscription form provided by 'mailchimp' into my website.

The button that means 'subscribe' or 'submit' is '#mc-embedded-subscribe'. When I submit my email address, if I succeed in subscribing, the subscription box disappears, and if I fail, I want to leave it as it is.

If the subscription is successful, '#mce-success-response' in the subscription form becomes 'display:block'. If it fails, '#mce-error-response' becomes 'display:block'.

So, I clicked the "Submit" button(#mc-embedded-subscribe) and wrote a code that if the subscription is successful (#mce-success-response -> "display:block"), the subscription column becomes "Fadeout".

But it doesn't work. (No. 1, 2, and 3 all don't work.) What did I write wrong?

 <div id="mc_embed_signup">... ... <div id="mce-responses" class="clear"> <div class="response" id="mce-error-response" style="display:none"></div> <div class="response" id="mce-success-response" style="display:none"></div> </div>... <div class="clear"><input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe" class="button" style="display: none;"></div>... </div>

 // 1 $('#mc-embedded-subscribe').click(function(){ if($("#mce-success-response").css("display") === 'block') { $('#mc_embed_signup').fadeOut(6500); } else {} }); // 2 $('#mc-embedded-subscribe').click(function(){ console.log($("#mce-success-response").css("display","block")) { $('#mc_embed_signup').hide(); } else {} }); // 3 $('#mc-embedded-subscribe').click(function(e){ $('mce-success-response'){ console.log($("#mce-success-response").css("display")) $(this).parent('#mc_embed_signup').hide(); } });

Answer 1

console.log($("#mce-success-response").css("display"))

try this to examine your if condition is true.