javascript - 如何复制 HTML 和用户输入,然后通过 HTTP 请求将其发送到服务器?

标签 javascript html

我试图将 HTML 与用户的输入一起复制,但我没有任何运气。这是我的代码,我尝试克隆表单,然后将其 http 到保存它的 php 文件。我知道它不起作用,因为我需要附加它。

JS:

<script type="text/javascript">
function submit_form()
{ 
    var xmlHttp = null;
    var formData = new FormData();
    var form = document.getElementById('form_div');
    var cln = form.cloneNode(true);
    var saveForm = '<html><body>' + cln + '</body></html>';
    formData.append("saveform", saveForm);
    var xmlHttp = new XMLHttpRequest()
    xmlHttp.open('POST', 'http.php?nocache='+crt_date, true);

    xmlHttp.send(formData);
    xmlHttp.onreadystatechange = function()
    {
        if (xmlHttp.readyState == 4)
        {         
            if (xmlHttp.status == 200)
            {
                var responsetext = xmlHttp.responseText;
                alert("Your request was sent, " + responsetext);
            }
            else
            {
                var err_str = "There was a problem retrieving the data +\n";
                err_str += "statusText = " + xmlHttp.statusText + "\n";
                err_str += "status = " + xmlHttp.status;
            }

        }
    } 
}
</script>

HTML:

<HTML>
    <HEAD>
        <meta http-equiv="X-UA-Compatible" content="IE=11">
    </HEAD>
    <BODY>
        <DIV id = "form_div">
            <FORM id = "form">
                <INPUT type = "text" value = "" id = "example" name = "example">
                <INPUT type="button" value="Submit" onclick="javascript:submit_form()">
            </FORM>
        </DIV>
    </BODY>
</HTML>

最佳答案

您无法将节点与字符串连接起来,您需要使用 innerHTML 属性来获取 HTML。

但是输入的 HTML 不包含对其值的更改。如果您希望反射(reflect)此更改,则需要将 value 属性复制到 value 属性。

var cln = form.cloneNode(true);
cln.querySelector("#example").setAttribute("value", document.querySelector("#example").value);
var saveForm = '<html><body>' + cln.innerHTML + '</body></html>';

关于javascript - 如何复制 HTML 和用户输入,然后通过 HTTP 请求将其发送到服务器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54259458/

相关文章:

javascript - 如何为平铺网格中的元素实现单击功能,当单击它时,它及其附近的元素会淡出

javascript - 使用 Vue.js 以更动态的方式显示复选框

javascript - 如何在其他功能中重定向到 Backbone 路由器

javascript - Javascript 函数未定义 JSP 错误

html - 如何将段落元素放入其父容器中?

PHP 书签

javascript - Tabpanel 中每个选项卡上的 ExtJS 关闭按钮

javascript - Bootstrap文章风格

html - 输入类型的宽度为 100% 并位于父 div 内

javascript - 使用 jquery 将 html 添加到表中