Question

我正在尝试使用ajax将文本从一个文本区域发布到php页面以回显到另一个textarea。当我这样做时，它适用于大约5个字符，然后完全停止。我尝试使用和不使用编码似乎没有什么区别，因为我只是尝试简单的计划文本，如“ddddddddddd”。

在example.html中

<!DOCTYPE html>
<html>
<body>
<style>
.center{
margin: 0 auto;
margin-left: auto;
margin-right: auto;
text-align:center;
}

</style>

<div class="center">

<textarea   onkeyup="changed()" onkeydown="changed()" onkeypress="changed()"  id="b1" rows="30" cols="81">
</textarea>

<textarea id="b2" rows="30" cols="81">
</textarea>

</div>

</body>
</html>
<script>
function changed(){

var text =document.getElementById("b1").value;

if(!text){
text ="";
}

     var xhr;
    if (window.XMLHttpRequest) {
        xhr = new XMLHttpRequest();
    }
    else if (window.ActiveXObject) {
        xhr = new ActiveXObject("Msxml2.XMLHTTP");
    }
    else {
        throw new Error("Ajax is not supported by this browser");
    }

    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 && xhr.status == 200) {

                document.getElementById('b2').value =xhr.responseText;

        }
    }

    xhr.open('POST', 'echo.php');
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    xhr.send("text=" + text);



}

</script>

在echo.php中

<?php 
 $mytext = $_POST["text"];
 echo $mytext;

?>

我看了几篇类似的帖子，但没有一个能解决我的问题。我没有使用表格。我一定要吗？ Textarea not POSTing with form

Answer 1

我不知道你要做什么，但是你可以用更少的要求实现相同的输出，如果你将脚本更改为：

<script>
function changed(){
    var text =document.getElementById("b1");
    if(!text){
       text ="";
    }
    else
    {
        text=text.value;
    }
    var text2 =document.getElementById("b2");
    if(!text2)
    {
       text2.value=text;
    }
}
</script>

希望它有所帮助。

修改

现在发现错误，好像你是ajax请求随机返回。

我输入'asd'=它会触发ajax

键入'asdf'=它会触发另一个ajax

现在当第二个ajax首先响应时发生错误，所以第二个文本区域的值首先是'asdf'，但是稍后在第一个ajax响应时，它会将当前值覆盖为'asd'。

要解决这个问题，请将脚本更改为：

<script> var pending_request=false; function changed(){ if(pending_request==false) { var text =document.getElementById("b1").value; if(!text){ text =""; } var xhr; if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else if (window.ActiveXObject) { xhr = new ActiveXObject("Msxml2.XMLHTTP"); } else { throw new Error("Ajax is not supported by this browser"); } xhr.onreadystatechange = function () { if (xhr.readyState == 4 && xhr.status == 200) { document.getElementById('b2').value =xhr.responseText; pending_request=false; } } pending_request=true; xhr.open('POST', 'echo.php'); xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xhr.send("text=" + text); } else { setTimeout(function(){ changed(); }, 3000); } } </script>

demo here

我们的想法是等待待处理的ajax请求在发送另一个之前做出响应：D
PS：对不起我的英语不好。

Answer 2

我做了VMcreator建议的更改并看到了重大改进，但仍然会＃34;打破＆＃34;。防止接收任何其他字符。我在他的演示中尝试了相同的步骤。它工作得很好。我决定尝试在另一个托管服务提供商上托管我的页面和php脚本，并且它已经工作了！

我打电话给我的托管服务提供商（godaddy），他们说由于服务器正在接收来自同一个ip的快速请求，因此它被垃圾邮件过滤器拒绝了。虽然我的ip没有被阻止，但我的许多请求都因此导致了更糟糕的竞争条件。

即时解决方案 - 切换托管服务提供商

长期解决方案 - （尚未发生）更改安全设置以接受请求。

Ajax通过帖子将文本从一个文本区域复制到另一个文本区域

2 个答案: