我想制作一個簡單的電子郵件輸入 + 按鈕表單，一旦提交，應該在同一頁面上替換為另一個 div。我在表單上應用了 jquery 的 .hide("slow") ，在第二個 div 上應用了 .show("slow") ，雖然它確實顯示/隱藏元素，但它不應用平滑過渡。我究竟做錯了什么？？實例： https: //codepen.io/mcancode/pen/vYKXmbr代碼： <!DOCTYPE html><html><head> <style>#subscribed > div > p { display: none;}</style></head><body> <main> <section id="newsletter"> <div id="unsubscribed"> <h3>Subscribe to our newsletter to get 10% off your next purchase</h3> <form id="newsletter-form"> <div> <input type="email" placeholder="Enter your email"> <button type="submit"> Submit </button> </div> </form> </div> <div id="subscribed"> <div> <p>Thank you for subscribing! You should receive an email with the discount code in the next 5 minutes.</p> </div> </div> </section> <!-----------------END OF NEWSLETTER----------> </main> <!--JS files...--> <!-- jQuery and JS bundle w/ Popper.js --> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> <script> $(() => { //check when newsletter form submitted $("#newsletter-form").submit((event)=> { event.preventDefault(); $("#unsubscribed").hide("slow"); $("#subscribed>div>p").show("slow"); })}); </script></body></html>
jquery show/hide with slow input 不工作
白衣非少年
2023-05-25 16:38:07
