无法从外部PHP文件中的AJAX调用中读取POST数组

我已经尝试了所有的解决方案，我可以谷歌，但我不能读取数据从POST数组在我的外部PHP文件。这是文本字段的HTML。

    <form>
    <textarea id="comment_text_area" name="comments" rows="5" cols="40">     
    </textarea>
    <label for="comment_text_area">Comment:</label>
    <br>
    <input type="submit" name="submit" value="Submit" onclick="SaveComments()">
    </form>

…和JS函数进行AJAX调用

function save()
{
    var data = document.getElementById("comment_text_area");
    var xhr = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
    xhr.open('POST', 'save_comments.php', true);
    xhr.onreadystatechange = function()
    {
        if (xhr.readyState == 4 && xhr.status == 200)
        {
            alert("Comments saved!");
        }
    }
    xhr.send(data);
} 

…和PHP文件

    <?php
    if(isset($_POST['comments']))
    {
    $data = htmlentities($_POST['comments']);
    $file = "comments.txt";
    file_put_contents($file, $data, FILE_APPEND | LOCK_EX);
    }
    else
    {
    $data = "empty";
    $file = "comments.txt";
    file_put_contents($file, $data, FILE_APPEND | LOCK_EX);
    }
    ?>

我所知道的是工作:AJAX调用成功完成，脚本正在运行，"空"正在写入。

我尝试过的事情:

1. 我读到事件侦听器函数应该在创建HTML元素之前附加到它们，这似乎是违反直觉的。没有改变。

使用

2. xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
   

不工作。而且，根据我所做的研究，这难道不应该只对GET调用有必要吗?(我需要使用POST)

1. 使POST调用同步。没有什么改变。

我知道你传递的元素的名称需要是你在PHP脚本中依赖的，但它不工作。我不想设置form action="因为我不想重定向，这就是我使用AJAX的原因。最后，我注意到，它在我点击提交时改变了URL，这是我期望从GET中看到的。这是GET特有的，对吧?我清楚地把它标记为POST。

有人看到我做错了什么吗?

注:-拜托，如果是JS方面的东西，不要jQuery。到目前为止，我一直在回避它，我正努力保持这种状态。