php - 使用ajax将文本区域信息存储到数据库中。工作正常，除非我以任何方式编辑文本区域。信息仍然被存储，但 XMLHTTP 永远不会关闭

Question

基本上，当用户单击“保存”时，我会调用一个函数，该函数从 textarea 获取内容并将其传递到一个 php 文件，该文件将其添加到数据库中。 我使用了一些 js 函数，一个用于在内容之间切换，另一个用于保存内容。 无论如何，如果我只是单击“保存”而不编辑文本区域中的任何内容，那么一切都会正常。但是，如果我以任何方式编辑文本(甚至删除一个字母并再次添加回来)，部分功能将停止工作。负责修改内容的部分。我已经标记了停止工作的部分。

我已经测试过这是否是我传递的内容..不是。 现在看起来文本区域本身变得困惑并且不会显示新信息。 我通过放置 2 个文本区域来测试它，一个文本区域保存要存储和编辑的内容，另一个仅用于显示更改(停止在主文本区域上工作的更改)。

function saveContent() {
    document.getElementById("editing").style.display = 'none';
    document.getElementById("observing").style.display = '';
    document.getElementById("contentArea").readOnly = true;


    if (window.XMLHttpRequest) // code for IE7+, Firefox, Chrome, Opera, Safari
    {
        xmlhttp = new XMLHttpRequest();
        alert("first if");
    }
    else // code for IE6, IE5
    {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        //alert("second if");
    }
    xmlhttp.onreadystatechange = function() {
        //alert(xmlhttp.readyState+" : "+xmlhttp.status);
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            alert("finished");
            document.getElementById("contentArea").innerHTML = "working"; < ---- * * THIS PART STOPS WORKING IF I MODIFY THE TEXTAREA IN ANY WAY * *
        }
    }
    //var Content = document.getElementById("contentArea");
    var content = "contenttt";
    //alert(content);
    xmlhttp.open("get", "saveContent.php?q=" + content_id + "&content=" + content, true);
    xmlhttp.send(null);
}​

Answer 1

如果给出的评论不能解决您的问题，请提供一些建议。

首先，问题可能在于您使用的是大写 C 的内容变量，或者可能就在这里。但我知道 chrome 往往会用 undefined variable 搞乱 ajax 调用。

//var Content = document.getElementById("contentArea");
var content = "contenttt";

其次，在 POST 中发送文本变量。

xmlhttp.Open("POST","saveContent.php?q=" + content_id, false);
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlhttp.send("content=" + content);

最后，考虑使用JQuery。它如此受欢迎是有原因的。它易于使用，此类问题很少发生，并且适用于所有已知的浏览器。

$.post('saveContent.php', {"q": content_id, "content": $('#contentArea').val()}, function(data){
    alert(data);
});