时间戳

首页 > 解决方案 > 发送 html 输入值

javascript - 发送 html 输入值

问题描述

我想发送一条消息，该消息在输入框中输入了值。例如，“嘿，我的名字是名字”（fname：输入值）和“姓氏”（lname：输入值）。

如何在消息正文中包含输入框中输入的值？

这是我的代码：

<!DOCTYPE html> 
<html> 
    
  <head> 
    <title>Sending Mail</title> 
    <script src="https://smtpjs.com/v3/smtp.js"></script> 
    <script type="text/javascript"> 
        function sendEmail() { 
        Email.send({ 
            Host: "smtp.gmail.com", 
            Username: "", 
            Password: "", 
            To: '', 
            From: "", 
            Subject: "", 
            Body: "",  // send entered values from input box
        }) 
            .then(function (message) { 
            alert("Mail has been sent successfully") 
            }); 
        } 
    </script> 
  </head> 

  <body> 
    <form method="post"> 
     <input type="text"  name="fname">  
         <input type="text"  name="lname">
        <input type="button" value="Send Mail"
            onclick="sendEmail()" /> 
    </form> 
  </body> 
    
</html>

标签： javascripthtml

解决方案

您将需要查询 DOM 以查找每个表单输入的值。一种方法是document.querySelector使用类似 CSS 的选择器搜索 DOM。此查询将返回使用该选择器找到的第一个元素，如果找不到任何内容，则返回 undefined。

对于输入字段，它将返回一个 InputElement ，它具有与之关联的属性，例如 current value。然后，您可以使用这些值来编译一个自定义字符串，您可以将其作为电子邮件消息的正文传递。

var fname = document.querySelector('input[name=fname]').value;

Email.send({
   ...
   Body: `Hello, ${fname}!`
})

推荐阅读