وعليكم السلام ورحمة الله وبركاته.
من المستحيل إرسال الإيميلات عن طريق ال html فقط حيث لإرسال الإيميلات ستحتاج إلى خادم ليقوم بهذا الأمر .
ولكن توجد طريقة وهي فتح البريد الإلكتروني الخاص بالمستخدم ويرسل رسالة لك من خلال البريد الإلكتروني الخاص به .
ولفعل ذلك سنستخدم كود جافا سكريبت والذى سيقوم بتحويلنا إلى عنوان mailto وهذا العنوان عندما يراه المتصفح سيقوم بفتح البريد الإلكتروني الإفتراضي .
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style type="text/css"> #contact-form { background: #ffffff; padding: 10px; } #ContactForm1_contact-form-name, #ContactForm1_contact-form-email, #ContactForm1_contact-form-email-message { margin: 5px auto; border: 1px solid #e3e3e3; transition: all .5s ease-out; width: 100%; border-radius: 10px; padding: 15px 20px; margin-bottom: 20px; background-color: #ffffff; } #ContactForm1_contact-form-submit { border: 1px solid #e3e3e3; font: unset; text-shadow: 1px 1px 5px #111; font-weight: 700; font-size: 14px; padding: 5px 15px; background-color: #689f38; border-radius: 5px; color: #fff; letter-spacing: 1px; cursor: pointer } #ContactForm1_contact-form-email:focus, #ContactForm1_contact-form-name:focus, #ContactForm1_contact-form-email-message:focus { outline: none; border-color: rgb(104 159 56); box-shadow: 0 0 5px rgb(104 159 56) } .contact-form-error-message-with-border { color: #b90000; font-weight: 700 } </style> </head> <body> <div dir="rtl" style="text-align: right;" trbidi="on"> <div id="contact-form"> <input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" placeholder="الاسم الكامل" size="30" type="text" value="" /> <input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" placeholder="بريدك الالكتروني" size="30" type="text" value="" /> <textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="الرسالة" rows="5"></textarea> <input id="ContactForm1_contact-form-submit" type="button" onclick="sendMail(event)" value="إرسال" /> <br /> <div style="text-align: center;"> <div id="ContactForm1_contact-form-error-message"></div> <div id="ContactForm1_contact-form-success-message"></div> </div> </div> </div> <script> function sendMail(e) { var name = document.getElementById('ContactForm1_contact-form-name').value; var email = document.getElementById('ContactForm1_contact-form-email').value; var message = document.getElementById('ContactForm1_contact-form-email-message').value; var body = " email : " + email + " name : " + name + " message : " + message window.location.href = "mailto:myemail@gmail.com?subject=mail&body=" + body; } </script> </body> </html>
هنا قمنا بالإستماع إلى حدث الضغط عل الزر وقمنا بإنشاء الدالة sendMail وبداخل الدالة نقوم بإعادة التوجيه إلى العنوان الذى سيقوم المتصفح بفتح البريد الخاص بالمستخدم لإرسال الرسالة على بريدك .
ويمكنك حذف myemail@gmail.com ووضع الإيميل الخاص بك الذى تريد أن تستقبل الرسائل عليه
التعليقات