Как добавить переменные из файла JS в часть почтового тела HTML? - PullRequest
Новая
       23

Как добавить переменные из файла JS в часть почтового тела HTML?

1 голос
/ 01 мая 2019

Это касается расширения Google Chrome, которое я пытаюсь создать.

У меня сейчас 2 файла. Один файл JS и один файл HTMl.

Я хочу использовать переменную JS в моем HTML-файле. Но я использую функцию mailto в моем файле HTMl. Поэтому, когда кто-то нажимает на изображение в файле HTML, он автоматически открывает почтовый клиент для пользователя и автоматически заполняет поля «to», «subject» и «body».

Итак, у меня есть одна переменная в моем файле JS, и я хочу, чтобы значение этой переменной было прикреплено в разделе тела почтового ящика.

Итак, мой вопрос: как мне это сделать?

Итак, вот мой файл JS - 

var all_details = "Core = " + core + "\n" + "Workspace GUID = " + workspaceId + "\n" + "Model GUID = " + modelId;

console.log(all_details);

// Итак, я хочу получить все данные из переменной "all_details" в моем поле HTML mailto body.

Вот мой HTML-код - 

<a id= "insert" href="mailto:abc@google.com?subject=Issue &body=${all_details}" target="_blank"><img border="0" src="support.png" width="50" height="50" title="Have questions?"></a>
<h3>Contact Us</h3>

Итак, я хочу, чтобы, когда я щелкаю по изображению выше (полученному из HTML-кода), он должен открыть почтовый ящик (теперь он открывается).

Я просто хочу, чтобы содержимое / данные из переменной "all-details" из моего JS были вставлены в раздел body почтового ящика электронной почты.

Ответы [ 2 ]

1 голос
/ 01 мая 2019

Вместо жесткого кодирования в href, вы можете использовать javascript, чтобы обнаружить щелчок по ссылке и получить доступ к переменной таким способом и «перенаправить» пользователя на mailto: вместо того, чтобы связываться с href.Вы также можете избавиться от target="_blank".Также вам не нужна якорная ссылка в любом случае. 

var all_details = "testdata";

document.getElementById("insert").addEventListener("click",function(e){
     e.preventDefault();
     location.href = "mailto:abc@google.com?subject=Issue &body=" + all_details;
});
 #insert{cursor:pointer;}
<img id= "insert" border="0" src="support.png" width="50" height="50" title="Have questions?">
<h3>Contact Us</h3>
0 голосов
/ 01 мая 2019

Вы можете добавить прослушиватель событий к ссылке insert и таким образом добавить переменную к ее href . Пример ниже; 

let insertA = document.getElementById('insert');
let allDetails = 'test-string';

insertA.addEventListener('click', function(e){
  e.preventDefault();
  this.href = this.href + allDetails;
  console.log(this.href);
})
<a id= "insert" href="mailto:abc@google.com?subject=Issue&body=" target="_blank"><img border="0" src="support.png" width="50" height="50" title="Have questions?"></a>
<h3>Contact Us</h3>
...