ホームページ > ウェブフロントエンド > フロントエンドQ&A > JavaScriptを使用してメールを送信する方法

JavaScriptを使用してメールを送信する方法

PHPz
リリース: 2023-04-25 13:41:20
オリジナル
3693 人が閲覧しました

電子メールの人気と応用がますます広まるにつれて、JavaScript は電子メールを送信するための一般的なツールになってきました。 JavaScript を使用すると、電子メール機能を Web サイトまたはアプリケーションに迅速かつ効率的に追加でき、ユーザーが Web サイトまたはアプリケーションを通じて電子メールを簡単に送信できるようになります。ここではJavaScriptを使用してメール送信機能を実装する方法を紹介します。

実装手順は次のとおりです。

  1. フォームを HTML ページに追加します。
<form action="" method="post">
  <label for="email">邮件地址:</label>
  <input type="email" id="email" name="email"><br><br>
  <label for="subject">主题:</label>
  <input type="text" id="subject" name="subject"><br><br>
  <label for="message">正文:</label>
  <textarea id="message" name="message"></textarea><br><br>
  <button type="submit" onclick="sendEmail()">发送邮件</button>
</form>
ログイン後にコピー
  1. メールサーバーの構成情報をJavaScriptで定義します。
let emailjsConfig = {
  USER_ID: 'your_user_id',
  TEMPLATE_ID: 'your_template_id',
  SERVICE_ID: 'your_service_id'
};
ログイン後にコピー

ここでの USER_ID は EmailJS に登録した後に取得したユーザー ID、TEMPLATE_ID は作成したメール テンプレートの ID、SERVICE_ID は作成したメール送信サービスの ID です。この情報は、メール送信 API を呼び出すときに必要になります。

  1. EmailJS を使用して電子メールを送信します。
function sendEmail() {
  let email = document.getElementById('email').value;
  let subject = document.getElementById('subject').value;
  let message = document.getElementById('message').value;

  emailjs.send(emailjsConfig.SERVICE_ID, emailjsConfig.TEMPLATE_ID, {
      to_email: email,
      from_name: '你的名字',
      subject: subject,
      message_html: message
    })
    .then(function(response) {
      console.log('邮件发送成功!', response.status, response.text);
      alert('邮件发送成功!');
    }, function(error) {
      console.log('邮件发送失败...', error);
      alert('邮件发送失败...', error);
    });
}
ログイン後にコピー

ここでは、EmailJS を使用して電子メールを送信し、メール サーバーに接続し、定義された EMAILJS_CONFIG 変数を通じて電子メールを送信します。 sendEmail 関数は、フォーム内の電子メール アドレス、件名、内容などの情報を取得し、この情報をメール サーバーに渡します。電子メールの送信が成功または失敗すると、対応するコンソール出力とプロンプト ボックス情報が生成されます。

上記は、JavaScript を使用してメールボックスでメールを送信する手順です。 Web サイトまたはアプリケーションで電子メールを送信できるようにする場合は、この例を参照して、実際の状況に応じてカスタマイズできます。

以上がJavaScriptを使用してメールを送信する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート