Question

您好，我想将数据发送到服务器，然后让php文件保存。但目前我甚至无法使用简单的POST工作。

这是javascript和html部分：此函数在头部声明：

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

    xhttp.open("POST","http://music.collwyncraig.info/hajimama/save_setlist.php",true);
    xhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xhttp.send("fsong=AbandonSeoul");
}

然后这个html就在身体里：

<button type="button" onclick="sendTableToServer()">Save Setlist</button>

这是php文件

<?php
if (isset($_POST["fsong"])){
    echo 'trying';
    $song = $_POST["fsong"]; 
    echo $song;
    echo 'ok';
}
?>

当我点击按钮时，没有任何反应。如果我使用<form>和提交按钮，浏览器会加载php文件，我可以访问输入。但是，我想使用这样的函数，因为我想要发送的信息将使用javascript和HTML DOM从html页面中取出。那么，为什么没有发生什么呢？：）

Answer 1

如果您不想使用jQuery ajax，请尝试使用纯粹的ajax：

<html>
    <head>
    <script type="text/javascript">
    sendTableToServer()
    {

    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
        else
      {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function()
      {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        //document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("GET","http://music.collwyncraig.info/hajimama/save_setlist.php?fsong=AbandonSeoul", true);
    xmlhttp.send();
    }
    </script>


<?php
if (isset($_GET["fsong"])){
    echo 'trying';
    $song = $_GET["fsong"]; 
    echo $song;
    echo 'ok';
}
?>

来源：http://www.w3schools.com/php/php_ajax_php.asp

Answer 2

如果您想要与表单相同的行为，除了您想从页面获取数据，只需创建一个表单并提交它：

var form = document.createElement('form');
form.action = 'http://www.example.com/do-something';
form.method = 'post';
var song = document.createElement('input');
song.type = 'hidden';
song.name = 'song';
song.value = 'Song Name';
form.appendChild(song);
form.submit();

Answer 3

请记住，AJAX本质上是异步的。您应该定义完成和错误条件的回调，因为您的数据不会立即返回。您可能需要follow this Google tutorial on AJAX。如果可用，JQuery会简化该过程。

如果您的唯一目标是将数据发送到服务器以写入文件，则不需要AJAX或Javascript。只需设置<form action="http://music.collwyncraig.info/hajimama/save_setlist.php">并将要发送的数据放入表单标记中即可。使用Javascript进行AJAX的唯一原因是“更好的行为”，这可能比您正在寻找的简单用法更复杂。

Answer 4

如果您对域名与地址栏中的域名不同，则会失败。您无法进行跨域AJAX请求：

xhttp.open("POST","http://music.collwyncraig.info/hajimama/save_setlist.php",true);

尝试删除方案和域名：

xhttp.open("POST","/hajimama/save_setlist.php",true);

这将使POST请求相对于当前域，因为此处不需要http和域。

简单的javascript AJAX帖子功能不起作用

4 个答案: