Добавление массива к ссылке a href с помощью Javascript/Jquery
В настоящее время я пишу функциональность, при которой пользователи будут нажимать на определенное письмо, и оно будет добавлено в список в локальном хранилище, после чего пользователь будет нажимать на кнопку, по сути, эта кнопка должна иметь тег href, так что все почтовые адреса будут скопированы в настройки почты пользователя по умолчанию (в моем случае outlook).
Мой вопрос в том, как преобразовать это в формат электронной почты? Я пробовал загрузить это в тег и это работает, но затем Django интерпретирует это как URL, а не список рассылки?
На данный момент у меня есть следующее:
<td class="virtualTd" onclick="putThis(this)">{{ client.email }}</td>
<script>
const emails_list = []
function putThis(control) {
var email = control.innerText;
emails_list.push(email);
}
</script>
Это заполняет массив со всеми адресами,
После этого пользователь может нажать эту кнопку, чтобы загрузить данные в локальное хранилище, с конечным намерением загрузить электронную почту outlook
<a href="#" id="sendEmail" class="btn btn-primary" onclick="popEmail()"> Email Client </a>
<script>
function popEmail() {
const jsonArr = JSON.stringify(emails_list);
localStorage.setItem("array", jsonArr);
const str = localStorage.getItem("array");
const parsedArr = JSON.parse(str);
console.log(parsedArr);
var a = document.getElementById('sendEmail');
a.href = parsedArr;
}
</script>
Почему локальное хранилище?
ПРИМЕЧАНИЕ: Вполне возможно, что у пользователя нет почтового клиента, настроенного на обработку нажатия на mailto
Также могут быть разные Символ разделения электронной почты в ссылке HTML-почты отличается в разных почтовых клиентах
let emails_list = []
document.getElementById("tb").addEventListener("click", e => {
const tgt = e.target;
if (tgt.classList.contains("virtualTd")) {
emails_list.push(tgt.textContent.trim());
}
});
document.getElementById('sendEmail').addEventListener("click", e => {
if (emails_list.length>0) this.href = `mailto:${emails_list.join(",")}?subject=Test&body=Test%20Body` // or ";"
console.log(this.href)
});
<a href="#" id="sendEmail" class="btn btn-primary">Email Client</a>
<table>
<tbody id="tb">
<tr>
<td>Joe</td>
<td class="virtualTd">Joe@mail.com</td>
</tr>
<tr>
<td>Fred</td>
<td class="virtualTd">Fred@mail.com</td>
</tr>
</tbody>
</table>