<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF8"> <meta name="viewport" content="width=devicewidth, initialscale=1.0"> <title>Contact Form</title> <style> body { fontfamily: Arial, sansserif; } form { width: 300px; margin: 0 auto; } input, textarea { width: 100%; marginbottom: 10px; } button { width: 100%; backgroundcolor: #4CAF50; color: white; padding: 10px; border: none; cursor: pointer; } button:hover { backgroundcolor: #45a049; } </style> </head> <body> <form id="contactform"> <h2>Contact Us</h2> <input type="text" id="name" placeholder="Name" required> <input type="email" id="email" placeholder="Email" required> <textarea id="message" placeholder="Message" rows="5" required></textarea> <button type="submit">Submit</button> </form> <script> document.getElementById("contactform").addEventListener("submit", function(event) { event.preventDefault(); var name = document.getElementById("name").value; var email = document.getElementById("email").value; var message = document.getElementById("message").value; if (name === "" || email === "" || message === "") { alert("Please fill in all fields."); } else { alert("Thank you for contacting us! We will get back to you shortly."); this.reset(); } }); </script> </body> </html>
(图片来源网络,侵删)
本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/444339.html
如有侵犯您的合法权益请发邮件951076433@qq.com联系删除