Javascript 从div中选择文本并将其包含到电子邮件中

我有一个网站上的电子邮件发件人，人们可以填写所需的输入框，然后按send，我就会收到一封电子邮件。来自所有输入框的文本将添加到电子邮件正文文本中。该网站还可以使用class=“tag”（div看起来像某种标签）在某些div中生成一些文本。如何将所有带有class标记的div中的文本添加到电子邮件中？这是我使用的代码：

JS

$（函数（）{
$（“输入，文本区域”）.jqBootstrapValidation({
对,，
submitError：函数（$form、event、errors）{
//其他错误消息或事件
},
submitSuccess：函数（$form，event）{
event.preventDefault（）；//防止默认提交行为
//从表单中获取值
变量名称=$（“输入名称”）.val（）；
var email=$（“输入电子邮件”）.val（）；
var phone=$（“输入电话”）.val（）；
var message=$（“textarea#message”）.val（）；
var firstName=name；//对于成功/失败消息
//检查名称中是否有空格以显示成功/失败消息
if（firstName.indexOf（“”）>=0）{
firstName=name.split（“”）.slice（0，-1）.join（“”）；
}
$.ajax({
url:“.//邮件/联系_me.php”，
类型：“POST”，
数据：{
姓名:姓名,，
电话:电话,，
电邮:电邮,，
讯息:讯息,，
},
cache:false，
成功：函数（）{
//成功信息
$（'#success'）.html（“”）；
$（'#success>.alert success'）.html（“×；”）
.附加（“”）；
$（“#success>.alert success”）
.append（“您的邮件已发送。”；
$（“#success>.alert success”）
.附加（“”）；
//清除所有字段
$（'#contactForm'）。触发器（“重置”）；
$（'.tag'）.remove（）；
},
错误：函数（）{
//失败消息
$（'#success'）.html（“”）；
$（'#success>.alert danger'）.html（“×；”）
.附加（“”）；
$（“#success>.alert danger”）。追加（“对不起”+firstName+”，我的邮件服务器似乎没有响应。请稍后再试或发送电子邮件至order@o-p-a-l.eu）；
$（“#success>.alert danger”）.append（“”）；
},
})
},
过滤器：函数（）{
return$（this）.is（“：可见”）；
},
});
$（“a[数据切换=\”选项卡\“]）。单击（函数（e）{
e、 预防默认值（）；
$（此）.tab（“显示”）；
});
});
/*单击完全隐藏失败/成功框时*/
$（'#name'）。焦点（函数（）{
$（'#success'）.html（''）；
});

PHP

HTML

01A001-Z03-71021X
02A001-Z03-71021X
03A001-Z03-71021X
发送消息

如果您试图执行类似操作，可以使用

getElementsByClassName

函数

// find all elements with the 'tag' class
var tags = document.getElementsByClassName('tag');
var tagText = '';

// loop through each found element and get the innerText property
for (var i=0; i< tags.length; i++){
    tagText += tags[i].innerText + ' ';
}

// trim the trailing whitespace
tagText = tagText.trim();

请注意，

childNodes

不返回文本。它们是对象，因此要获取值，必须使用

nodeValue

属性

以下是MDN的链接：

---

将此代码包含到您的代码中

您需要将此代码添加到

SubmitSuccess

方法：

submitSuccess: function($form, event) {
    event.preventDefault(); // prevent default submit behaviour
    // get values from FORM
    var name = $("input#name").val();
    var email = $("input#email").val();
    var phone = $("input#phone").val();

    // this is where you're getting your message text
    var message = $("textarea#message").val();

    // add in the childNodes code
    var tags = document.getElementsByClassName('tag');
    var tagText = '';
    for (var i=0; i< tags.length; i++){
        tagText += tags[i].childNodes[0].nodeValue + ' ';
    }
    // trim the trailing whitespace
    tagText = tagText.trim();

    // add the message body and the tag text together:
    message = message + 'Tags: ' + tagText;

    // continue your code as before
    ....

submitSuccess:函数（$form，event）{
event.preventDefault（）；//防止默认提交行为
//从表单中获取值
变量名称=$（“输入名称”）.val（）；
var email=$（“输入电子邮件”）.val（）；
var phone=$（“输入电话”）.val（）；
//这就是你收到短信的地方
var message=$（“textarea#message”）.val（）；
//添加childNodes代码
var tags=document.getElementsByClassName（'tag'）；
var tagText=''；
对于（var i=0；i

您是在询问如何在电子邮件正文中包含内容，还是如何在电子邮件正文中设置文本的样式？在电子邮件正文中包含div的内容（在本例中仅包含文本01A001-Z03-71021、02A001-Z03-71021和03A001-Z03-71021）。对不起，我该如何使用此代码？我是JS的新手。

<form name="sentMessage" id="contactForm" novalidate>

<input type="text" class="form-control" placeholder="Your Name *" id="name" required data-validation-required-message="Please enter your name.">
<input type="email" class="form-control" placeholder="Your Email *" id="email" required data-validation-required-message="Please enter your email address.">
<input type="tel" class="form-control" placeholder="Your Phone *" id="phone" required data-validation-required-message="Please enter your phone number.">
<textarea class="form-control" placeholder="Your Message *" id="message" required data-validation-required-message="Please enter a message."></textarea>


<div class="cart" contenteditable="false">

<div class="tag">01A001-Z03-71021<span class="remove">X</span></div>
<div class="tag">02A001-Z03-71021<span class="remove">X</span></div>
<div class="tag">03A001-Z03-71021<span class="remove">X</span></div>

<input type="text" class="newtag" placeholder="Your items" id="" readonly />
</div>

<button id="submitbtn" type="submit" class="btn btn-xl">Send Message</button>
</form>

// find all elements with the 'tag' class
var tags = document.getElementsByClassName('tag');
var tagText = '';

// loop through each found element and get the innerText property
for (var i=0; i< tags.length; i++){
    tagText += tags[i].innerText + ' ';
}

// trim the trailing whitespace
tagText = tagText.trim();

// get all the elements as before:
var tags = document.getElementsByClassName('tag');
var tagText = '';

// loop through each found element and use the childNodes property
for (var i=0; i< tags.length; i++){
    tagText += tags[i].childNodes[0].nodeValue + ' ';
}

// trim the trailing whitespace
tagText = tagText.trim();

submitSuccess: function($form, event) {
    event.preventDefault(); // prevent default submit behaviour
    // get values from FORM
    var name = $("input#name").val();
    var email = $("input#email").val();
    var phone = $("input#phone").val();

    // this is where you're getting your message text
    var message = $("textarea#message").val();

    // add in the childNodes code
    var tags = document.getElementsByClassName('tag');
    var tagText = '';
    for (var i=0; i< tags.length; i++){
        tagText += tags[i].childNodes[0].nodeValue + ' ';
    }
    // trim the trailing whitespace
    tagText = tagText.trim();

    // add the message body and the tag text together:
    message = message + 'Tags: ' + tagText;

    // continue your code as before
    ....