Javascript 如何使用mailto链接和复制邮件上的信息来创建自定义联系人表单？

我正在创建一个简单的联系人表单，带有：姓名和对象输入+发送按钮（这是一个

还有我的片段：


p{
宽度：50%；
颜色：#666；
文本对齐：居中；
保证金：0自动；
}
.name_输入{
显示：块；
保证金：50px自动；
左侧填充：10px；
边界半径：5px；
边框：2个实心rgb（255194,0）；
宽度：50%；
高度：30px；
}
.btn{
文本对齐：居中；
背景色：rgb（255194,0）；
填充：10px；
利润率：10px自动；
宽度：30%；
光标：指针；
}
.btn:悬停{
背景色：#666；
}
a{
文字装饰：无；
颜色：#FFF；
}


输入对象和您的姓名，单击“发送”，对象将显示在电子邮件对象上，您的姓名将显示在电子邮件正文上。

您也可以将
mailto
添加为表单的操作属性，如下所示：

<form action="mailto:www.myWebSite.com" method="GET" enctype="text/plain">
  <p>
  Enter the object and your name, click on "send" the object will be on the email object, and your name will appears on the body of the email.
  </p>
   <input class="name_input" type="text" name="subject" id="contact-object" placeholder="The object"/>
  <input class="name_input" type="text" name="body" id="contact-name" placeholder="Your name"/>

  <div class="btn">
  <input type="submit" value="Submit" />

  </div>
</form>

var mailButton = function mailButton(mailto, title, mailBody){
   var href = "mailto:"+mailto+"?subject="+title+"&body="+mailBody;
   var a = document.createElement(a);
   a.setAttribute('href', href);
   return a
}



输入对象和您的姓名，单击“发送”，对象将显示在电子邮件对象上，您的姓名将显示在电子邮件正文上。

如果你想让它像普通的mailto链接一样打开，这需要一些javascript。首先，我们需要一个函数来构造你的链接

function constructMailTo() {
    var contactObject = document.getElementById('contact-object').value;
    var contactName = document.getElementById('contact-name').value;

    var mailto = "mailto:myEmail@domain.com?Subject=Object: " + contactObject + "name: " + contactName;

    // URI escape the link
    return encodeURI(mailto);
}

以及将其插入元素的函数

function insertMailto() {
    document.getElementById('mailto-element').href = constructMailTo();
}

最后，我们需要在输入改变时触发它

<input class="name_input" type="text" name="contact-object" id="contact-object" placeholder="The object" onchange="insertMailTo();"
onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange()/>

<input class="name_input" type="text" name="contact-name" id="contact-name" placeholder="Your name" onchange="insertMailTo();"
onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange()/>;

；
此任务需要使用js

您必须做的第一件事是将适当的
href
添加到
标记中，类似于：

<a href="mailto:info@myWebSite.com?subject=Your Subject&body=Your Body>send</a>

然后添加一个函数来处理表单提交，并单击该
元素

function fakesubmit(e){
   e.preventDefault();
   var title = document.getElementById('contact-object').value;
   var mailBody = document.getElementById('contact-name').value;
   var a = mailButton(info@myWebSite.com, title, mailBody);
   a.click();
}

最后-你的表格：

<form onsubmit="fakesubmit(e)">
  <p>
  Enter the object and your name, click on "send" the object will be on the email object, and your name will appears on the body of the email.
  </p>
   <input class="name_input" type="text" name="contact-object" id="contact-object" placeholder="The object"/>
  <input class="name_input" type="text" name="contact-name" id="contact-name" placeholder="Your name"/>

  <input type="submit" class="btn" value="send"/>
</form>



输入对象和您的姓名，单击“发送”，对象将显示在电子邮件对象上，您的姓名将显示在电子邮件正文上。


询问你是否需要进一步的帮助