Fatal编程技术网
  • php/
  • AJAX中的PHP表单不返回

AJAX中的PHP表单不返回

php ajax

AJAX中的PHP表单不返回,php,ajax,Php,Ajax,是否可以从PHP表单获取AJAX（javascript）中的返回值 这是我在AJAX中的PHP表单： function start() { xhr = new XMLHttpRequest(); if (xhr == null) { alert('Probleem met het maken van het XMLHttpRequest object'); return; } var url="xml/Producten

是否可以从PHP表单获取AJAX（javascript）中的返回值

这是我在AJAX中的PHP表单：

function start()
{
    xhr = new XMLHttpRequest();

    if (xhr == null)
    {
        alert('Probleem met het maken van het XMLHttpRequest object');
        return;
    }

    var url="xml/Producten.xml";


    if (document.getElementById("radio1").checked)
    {
        xhr.onreadystatechange=alles;
    }
    else
    {
        xhr.onreadystatechange=drank;
    }



    xhr.open("Get",url,true);
    xhr.send(null); 
}
function alles()
{
    if (xhr.readyState == 4 && xhr.status == 200)
    {
        var xmlDoc = xhr.responseXML;
        var strOutput;

        strOutput="<table class='product'><tr>";

        var aantal = xmlDoc.getElementsByTagName("naam").length;

        for (var i=0; i<aantal; i++)
        {
            strOutput += "<td><p><img src='" + xmlDoc.getElementsByTagName("img")[i].childNodes[0].nodeValue + "'></p>";
            strOutput += "<p>&euro; " + xmlDoc.getElementsByTagName("prijs")[i].childNodes[0].nodeValue + "</p>";
            strOutput += "<p>" + xmlDoc.getElementsByTagName("naam")[i].childNodes[0].nodeValue + "</p>";
            strOutput += "<p><form action='' method='POST'>";
            strOutput += "<input class= 'nummers' type='number' name='aantal' min='1' max='20'>";
            strOutput += "<input type='submit' value='In mandje' name= 'toevoegen'>";
            strOutput += "<input type='hidden' name='id' value='" + i +"'>";
            strOutput += "<input type='hidden' name='id' value='" + xmlDoc.getElementsByTagName("img")[i].childNodes[0].nodeValue +"'>";
            strOutput += "</form></p></td>";    

        }
        strOutput += "</table>";
    }
    document.getElementById("tekstBox").innerHTML = strOutput;
}
回答：

for
循环中的
i
必须从1开始，而不是从0开始，因为我的产品的id从1开始。

要回答您的实际问题，是的，使用Ajax从php脚本中获取返回值是非常有可能的，这就是Ajax被大量使用的原因

虽然我不完全确定你当前的脚本为什么不起作用，但我并不感到惊讶，因为它不是你想要的方式

看看jQuery，它是将Javascript应用到项目中的最佳方式，特别是当您试图使用Ajax来改变网页内容时

$.get("xml/Producten.xml", function (result) {
    //this is the success result handler,
    //result contains whatever you return in your php script.
    var radio = $("#radio1"); //getElementById.

    //etc
});
如果您选择采用这种方法，我可以在jQuery方面为您提供更多帮助。

回调函数
alles
&
引用变量
xml
，该变量看起来已经在ajax函数中声明（或者简单地实例化）。要么全局声明xml变量（即：
var xml；
），要么作为对它的引用或回调响应传递。下面的代码将响应传递给回调，而不是xhr对象本身


function start(){
    var xhr = new XMLHttpRequest();
    if (xhr == null){
        alert('Probleem met het maken van het XMLHttpRequest object');
        return;
    }
    var url="xml/Producten.xml";

    xhr.onreadystatechange=function(){
        if( xhr.readyState == 4 && xhr.status == 200 ) {
            var callback=document.getElementById("radio1").checked ? alles : drank;
            callback.call( this, xhr.responseXML );
        }
    };
    xhr.open( "GET", url, true );
    xhr.send( null ); 
}

function alles(r){
    if (r) {
        var xmlDoc = r;
        var strOutput;

        strOutput="<table class='product'>";

        var aantal = xmlDoc.getElementsByTagName("naam").length;

        for (var i=0; i<aantal; i++) {
            strOutput += "<tr><td><p><img src='" + xmlDoc.getElementsByTagName("img")[i].childNodes[0].nodeValue + "'></p>";
            strOutput += "<p>&euro; " + xmlDoc.getElementsByTagName("prijs")[i].childNodes[0].nodeValue + "</p>";
            strOutput += "<p>" + xmlDoc.getElementsByTagName("naam")[i].childNodes[0].nodeValue + "</p>";
            strOutput += "<p><form action='' method='POST'>";
            strOutput += "<input class= 'nummers' type='number' name='aantal' min='1' max='20'>";
            strOutput += "<input type='submit' value='In mandje' name= 'toevoegen'>";
            strOutput += "<input type='hidden' name='id' value='" + i +"'>";
            strOutput += "<input type='hidden' name='id' value='" + xmlDoc.getElementsByTagName("img")[i].childNodes[0].nodeValue +"'>";
            strOutput += "</form></p></td></tr>";    
        }
        strOutput += "</table>";
    }
    document.getElementById("tekstBox").innerHTML = strOutput;
}



函数开始（）{
var xhr=new XMLHttpRequest（）；
if（xhr==null）{
警报（“Probleem遇到了maken van het XMLHttpRequest对象”）；
返回；
}
var url=“xml/Producten.xml”；
xhr.onreadystatechange=函数（）{
如果（xhr.readyState==4&&xhr.status==200）{
var callback=document.getElementById（“radio1”）。选中？所有：已喝；
callback.call（this，xhr.responseXML）；
}
};
xhr.open（“GET”，url，true）；
xhr.send（空）；
}
函数alles（r）{
if（r）{
var xmlDoc=r；
无功功率输出；
strOutput=“”；
var aantal=xmlDoc.getElementsByTagName（“naam”）.length；

对于（var i=0；i首先，您在这里执行函数
alles
：


xhr.onreadystatechange=alles;


并将该函数的结果（在本例中为
undefined
）分配给
xhr.onreadystatechange

现在，当readystate发生更改时，
XMLHttpRequest
尝试调用
onreadystatechange
，它现在是
未定义的
，因此不会发生任何事情

因此，您的
alles（）
函数应该如下所示：


function alles(){

    return function(){
        if (xhr.readyState == 4){
            if(xhr.status == 200){
                var xmlDoc = xhr.responseXML;
                var strOutput;

                strOutput="<table class='product'><tr>";

                var aantal = xmlDoc.getElementsByTagName("naam").length;

                for (var i=0; i<aantal; i++){
                    strOutput += "<td><p><img src='" + xmlDoc.getElementsByTagName("img")[i].childNodes[0].nodeValue + "'></p>";
                    strOutput += "<p>&euro; " + xmlDoc.getElementsByTagName("prijs")[i].childNodes[0].nodeValue + "</p>";
                    strOutput += "<p>" + xmlDoc.getElementsByTagName("naam")[i].childNodes[0].nodeValue + "</p>";
                    strOutput += "<p><form action='' method='POST'>";
                    strOutput += "<input class= 'nummers' type='number' name='aantal' min='1' max='20'>";
                    strOutput += "<input type='submit' value='In mandje' name= 'toevoegen'>";
                    strOutput += "<input type='hidden' name='id' value='" + i +"'>";
                    strOutput += "<input type='hidden' name='id' value='" + xmlDoc.getElementsByTagName("img")[i].childNodes[0].nodeValue +"'>";
                    strOutput += "</form></p></td>";    

                }
                strOutput += "</table>";
                document.getElementById("tekstBox").innerHTML = strOutput;
            }
        }
    }
}



函数alles（）{
返回函数（）{
if（xhr.readyState==4）{
如果（xhr.status==200）{
var xmlDoc=xhr.responseXML；
无功功率输出；
strOutput=“”；
var aantal=xmlDoc.getElementsByTagName（“naam”）.length；

对于（var i=0；iuse jQuery代替javascript用于batter performance）您在控制台中看到了吗？？？可能显示了错误？？您调用了
start（）了吗
function？Where？@IshanShah-加载一个包含了所有您想通过附加函数调用来完成的事情的大块库如何提高性能？
xhr=new-XMLHttpRequest（）；
–在最好的情况下，使用Globals是一件痛苦的事情。Globals+异步请求将为您提供竞争条件。不要为此使用Globals。@在浏览器中安装Manariba。它将帮助您调试问题。@Manariba我已经包括了这一行，
document.getElementById（“tekstBox”）.innerHTML=strOutput；
inner
if
block。请使用更新的代码测试您的应用程序。我仍然有一个空页面…我不明白？当我运行您的脚本时，我仍然没有得到任何terurn值，您在哪里使用
start
函数？代码确实有效-测试过，并且看起来很好。使用您的html代码它就可以工作~see screenshot：你看到控制台中的请求了吗？是的，我正在从XML文件中获取所有信息，但上面php中的代码无法运行：让我们。

function alles(){

    return function(){
        if (xhr.readyState == 4){
            if(xhr.status == 200){
                var xmlDoc = xhr.responseXML;
                var strOutput;

                strOutput="<table class='product'><tr>";

                var aantal = xmlDoc.getElementsByTagName("naam").length;

                for (var i=0; i<aantal; i++){
                    strOutput += "<td><p><img src='" + xmlDoc.getElementsByTagName("img")[i].childNodes[0].nodeValue + "'></p>";
                    strOutput += "<p>&euro; " + xmlDoc.getElementsByTagName("prijs")[i].childNodes[0].nodeValue + "</p>";
                    strOutput += "<p>" + xmlDoc.getElementsByTagName("naam")[i].childNodes[0].nodeValue + "</p>";
                    strOutput += "<p><form action='' method='POST'>";
                    strOutput += "<input class= 'nummers' type='number' name='aantal' min='1' max='20'>";
                    strOutput += "<input type='submit' value='In mandje' name= 'toevoegen'>";
                    strOutput += "<input type='hidden' name='id' value='" + i +"'>";
                    strOutput += "<input type='hidden' name='id' value='" + xmlDoc.getElementsByTagName("img")[i].childNodes[0].nodeValue +"'>";
                    strOutput += "</form></p></td>";    

                }
                strOutput += "</table>";
                document.getElementById("tekstBox").innerHTML = strOutput;
            }
        }
    }
}