使用电子邮件地址位于 HTML 表中的输入类型"submit"向多个人员发送电子邮件

Question

我有一个HTML表，其中包含3列电子邮件地址。我正试图弄清楚如何使用action=mailto形式向表中的所有电子邮件地址发送一封群发电子邮件，并将该操作分配给一个输入类型="；提交"；按钮基本上，我想要的是当我按下提交按钮时，浏览器会打开我的电子邮件客户端，并在其中包含每个人的电子邮件地址；至"；电子邮件块。

这里有一个例子：

<form action="mailto:?"method="get">
<table class="rep">
<th class="rep">Office</th>
<th class="rep">Primary Representative</th>
<th class="rep">Alternate Representative</th>
<th class="rep">Phone #</th>
<th class="rep">Pri. E-mail</th>
<th class="rep">Alt. E-mail</th>
<th class="rep">Supervisor</th>
<th class="rep">Sup. E-mail</th>
<tr class="rep">
<td class="rep">Mail Room</td>
<td class="rep">Harry Frill</td>
<td class="rep">Jack Daniels</td>
<td class="rep">123-456-7890</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
<td class="rep">Lauren Jory</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
</tr>   
<tr class="rep">
<td class="rep">Labs</td>
<td class="rep">Jay Holiday</td>
<td class="rep">Tony Tarks</td>
<td class="rep">987-676-5432</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
<td class="rep">Ben Dinkle</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
</tr>   
<input type="Submit" value="E-Mail all reps">
</table>
</form>

Answer 1

我添加了一个按钮和一个事件侦听器，当单击该按钮时，它会运行所有<a>标记，提取其电子邮件地址，并创建一个包括所有这些地址的mailto:URL，并将用户重定向到该URL。

document.querySelector('button#doIt').addEventListener('click', function() {
var emails = []
document.querySelectorAll('a[href^="mailto:"]').forEach(function(elmt){
var email = elmt.getAttribute('href').replace(/^mailto:/, '')
emails.push(email)
});
document.location.href = 'mailto:' + emails.join(',')
});

<table class="rep">
<tr>
<th class="rep">Office</th>
<th class="rep">Primary Representative</th>
<th class="rep">Alternate Representative</th>
<th class="rep">Phone #</th>
<th class="rep">Pri. E-mail</th>
<th class="rep">Alt. E-mail</th>
<th class="rep">Supervisor</th>
<th class="rep">Sup. E-mail</th>
</tr>
<tr class="rep">
<td class="rep">Mail Room</td>
<td class="rep">Harry Frill</td>
<td class="rep">Jack Daniels</td>
<td class="rep">123-456-7890</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
<td class="rep">Lauren Jory</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
</tr>   
<tr class="rep">
<td class="rep">Labs</td>
<td class="rep">Jay Holiday</td>
<td class="rep">Tony Tarks</td>
<td class="rep">987-676-5432</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
<td class="rep">Ben Dinkle</td>
<td class="rep"><a href="mailto:[e-mail]">E-Mail</td>
</tr> 
</table>
<button id="doIt">Do it!</button>