如何将textarea的内容添加到电子邮件正文中

时间:2017-06-22 22:30:05

标签: javascript html forms email

您好:我已经在html中创建了一个带有表的表单,使用select来选择选项。一种选择是"其他"它生成一个新的文本区域输入字段。表单完成后,用户可以通过电子邮件发送给自己。除了新的'其他"我可以让这个选项适用于所有选择的选项。类别。它不是将新文本添加到电子邮件正文中,而是指出" [object HTMLTableCellElement]"。我一直试图让这个工作,但一直无法解决它或找到一个帮助我的答案 - 作为编码的相对新手我不能帮助我思考我错过了一些明显的东西......任何帮助或建议会很棒,谢谢

`         

通过电子邮件发送新输入

    <form action="#" method="post" id="myForm">
        <table id="myTable">
            <tr>
                <td><select name="variableList" id="variableList" class="select">
                <option value="" disabled selected>Please choose...</option>    
                <option value="Var 1">Var 1</option>
                <option value="Var 2">Var 2</option>
                <option value="Var 3">Var 3</option>
                <option value="Other">Other...</option>
                </select></td>
            </tr>
            <tr>
                <td id="newVariable"></td>
            </tr>
            <tr>
                <td><input type="email" name="email" id="emailID" placeholder="Your email address..."></td>
            </tr>
            <tr>
                <td><button type="button" class="buttons" onclick="sendEmail()" id="sendEmail()">Email</button></td>
            </tr>

        </table>
    </form>`

这是javascript:

        document.getElementById("variableList").addEventListener("change", generateTxtBox);

        var x = 1;

        function generateTxtBox(){
                //Create new input textarea if "Other" is selceted from list of options
                if (x==1 && document.getElementById('variableList').value == "Other") {
                var input = document.createElement("input");
                input.setAttribute('type', 'textarea');
                input.setAttribute('placeholder', 'Your new variable...');
                var parent = document.getElementById("newVariable");
                parent.appendChild(input);
                x += 1;
                }
        }

        function sendEmail(){
            var email = document.getElementById("emailID").value;
            var subject = "Email variables";
            var variableList = document.getElementById("variableList").value;
            document.getElementById("newVariable").addEventListener("change", getText);
                function getText(){
                    document.getElementById("newVariable").textContent = newVariable;
                }
            if (document.getElementById('variableList').value == "Other"){
                window.location = "mailto:" + email + "?subject=" + subject + "&body=" + newVariable;
            } else {
            window.location = "mailto:" + email + "?subject=" + subject + "&body=" + variableList;
            }    
        }

1 个答案:

答案 0 :(得分:2)

作业的工作方式如下:variable = [new value];

接下来,您在发送&#34;发送&#34;之前添加了一个事件监听器。电子邮件,意味着您作为处理程序设置的功能永远不会运行。即使它确实运行,订单也是错误的。

最后,newVariable实际上是id的{​​{1}},这意味着您要将表格单元格的文本表示添加为<td>电子邮件链接。

&#13;
&#13;
body
&#13;
document.getElementById("variableList").addEventListener("change", txtBox);

function txtBox() {
  // show textarea if "Other" is selected from list of options
  document.getElementById("txtBoxRow").style.display = this.value == "Other" ? "table-row" : "none";
}

function sendEmail() {
  var email = document.getElementById("emailID").value;
  var subject = "Email variables";
  var variableList = document.getElementById("variableList").value;
  var body = variableList == "Other" ? document.getElementById("newVariable").value : variableList;
  window.location = "mailto:" + email + "?subject=" + subject + "&body=" + body;
}
&#13;
#txtBoxRow {
  display: none
}
&#13;
&#13;
&#13;