对PHP的AJAX调用未返回值

Question

我有3个文件链接在一起： index.php functions.js和compute.php

index.php有一个div，该div调用functions.js中的一个functions.js ： compute() ，该functions.js发送AJAX请求以在compute.php执行某些compute.php

index.php ：

<form id = "input_form">
    <textarea name = "row" id = "inputform" placeholder="Input row here"></textarea> 
    <input type = "submit" value = "Enter" onclick="compute(inputform.value);">
</form>
<div id = "output_container">
    <p id = "output"></p>
</div>

当按下按钮时，调用compute()来传递textarea中的任何内容作为数据。

function compute(row){
    var xhttp;
    if(window.XMLHttpRequest){
        xhttp = new XMLHttpRequest();
    }
    else{
        xhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xhttp.onreadystatechange = function() {

        if (xhttp.readyState == 4) {
            output.innerHTML = xhttp.responseText;
        }
    };
    xhttp.open("GET","compute.php?row="+row,true);
    xhttp.send(null);
}

这会将值传递到php脚本中，该脚本只是假定将textarea中的内容输出到#output

<?php

$str = $_GET['row'];
echo $str;

?>

当我通过单击按钮测试程序时，没有任何反应表明出现了问题。 我试图通过添加window.alert('something');来查明问题window.alert('something'); 在检查if(xhttp.readyState == 4)却没有出现一个弹出框，这似乎是问题出在函数和计算之间。

我测试了phpinfo(); 而且看起来php在我的服务器上也正常工作

Answer 1

问题：表单无需提交ajax调用即可提交，因为您的代码包含type ='submit'

解决方案：将类型更改为按钮：

<input type = "button" value = "Enter" onclick="compute(inputform.value);">

同时更新代码以正确获取输出：

if (xhttp.readyState == 4) {
        document.getElementById("output").innerHTML = xhttp.responseText;
    }