JavaScript .innerHTML 更改后重新获取 <form>-element 值答案

【问题标题】：Re-get <form>-element values after JavaScript .innerHTML changeJavaScript .innerHTML 更改后重新获取 <form>-element 值
【发布时间】：2011-02-16 17:11:38
【问题描述】：

我有一个包含多个文本输入字段和一个下拉列表的表单。下拉列表的内容由 php 脚本生成以匹配数据库结构。我要做的是让用户从下拉列表中选择一个选项，然后根据选择通过从数据库中加载一些文本来更新表单视图，然后将其放入以供用户编辑（AJAX 样式是）。我用php再次生成整个表单，将查询到的内容添加到视图中。

问题是：现在当用户对输入字段的文本内容进行了更改时，他按下了“提交更改”按钮。现在我必须获取文本字段的更改内容来更新数据库中的行。我不知道如何正确地做到这一点。

我正在尝试使用表单的 POST 方法将更改的内容传递给 php 脚本，但它无法获取任何内容，因为 AJAX 样式并没有真正更改页面的 HTML。

以下是我如何尝试实现此目的的简短复制：

页眉：

<head>
<script>
function updateForm(str) {
    if (window.XMLHttpRequest) {
        xmlhttp=new XMLHttpRequest();
    }
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {
                document.getElementById("divContainingForm").innerHTML=xmlhttp.responseText;
            }
    }

    xmlhttp.open("POST","/scripts/regenerateTheForm.php",true);
    xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xmlhttp.send("id=" + str);
}
</script>
</head>

页面正文：

<form action="/scripts/changeTheOldOne.php" method="post">
    <div id="form">
        <fieldset>
            <label for='list'>Content to edit</label>
            <select id='list' name="list" onchange='updateForm(this.value)' autofocus>
            <?php echo(generateListOptions()); ?> //php-function
            </select>
            </fieldset>
            <fieldset>
                <label for="header">Header</label>
                <input required type="text" id="header" />
            </fieldset>
            <fieldset>
                <label for="body">Plain text</label>
                <textarea required id="body" rows="16" maxlength="1500"></textarea>
            </fieldset>
        </fieldset>
    </div>
</form>

regenerateTheFrom.php 中的函数返回生成的表单，该表单现在在字段中包含文本，JavaScript 将其写入页面并更新用户视图。用户现在可以查看检索到的内容并对其进行编辑，但是当提交表单时，changeTheOldOne.php 无法从 $_POST 数组中获取 AJAX 更新和用户编辑的表单值。

【问题讨论】：

我明白你在做什么，但你需要展示一些代码让我们能够提供相关帮助。希望不是你几乎生产的 HTML/JS 的一个巨大的 blob，而是你尝试如何做的一些小的复制。

标签： php javascript html post innerhtml

【解决方案1】：

问题解决了！

这只是一个菜鸟。忘记了输入字段中的名称标签，这就是 PHP POST 无法获取任何信息的原因。我以为 id 对 php 来说就足够了，但事实并非如此！

【讨论】：