Question

我知道ajax很容易与jquery一起使用，但在这里我试图理解带有核心javascript的ajax，我将两个值名称和年龄从index.html发送到indexPhp.php，在控制台中显示此消息{{ 1}}但它没有在div中显示任何结果，这里是html，js和php脚本

XHR finished loading: POST "http://localhost:8080/delPro/indexPhp.php".

的Javascript

<html>
<head>    
<link rel="stylesheet" type="text/css" href="style.css"/>
<script src="scripts.js"></script>
</head>        

<body>            
Name: <input type="text" id="name" name="name"><br><br>
Age:  <input type="text" id="age" name="age"><br><br>  
<button type="submit" value="Submit" onclick="showUser()">Submit</button>
<div id="resultDiv"></div>     
</body>        
</html>

php脚本

function showUser() {

var hr = new XMLHttpRequest();
var url= "indexPhp.php";   
var name= document.getElementById("name").value;
var age= document.getElementById("age").value;    

var vars = {Name: name, Age: age};

hr.open("POST",url,true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

hr.onreadystatechange = function(){

    if(hr.readyState == 4 && hr.status == 200){

        var return_data = hr.responseText;
        alert(hr.responseText);
        document.getElementById("resultDiv").innerHTML = return_data;
    }        
}
  hr.send(vars);

}

Answer 1

您是否尝试过这样的数据，

ModelMultipleChoiceField

在您的代码中，您将数据作为对象发送。

Answer 2

这是我以前制作的ajax函数。它可以同时发布和获取，使用就像你使用jQuery的ajax一样。

function ajax(options, timeout){
    method = options.method || "POST";
    url = options.url || "#";
    (!timeout) ? timeout = 10000 : timeout = timeout * 1000; 
    var request, timedOut = false, xhrTooLong, datas = "";
    try{
        request = new XMLHttpRequest();
    } catch ( error ) {
        try {
            request = new ActiveXObject( "Microsoft.XMLHTTP" );
        } catch ( error ) {
            return true;
        }
    }
    if(options.data){
        for( dat in options.data){
            (datas == "")?datas+= (method.toLowerCase()=="get"?"?":"")+dat+"="+
               options.data[dat]:datas+="&"+dat+"="+options.data[dat];
        }
    }
    if(method.toLowerCase() == "get" && datas.length > 0)
        url = url + datas;
    request.open(method, url, true);
    request.onreadystatechange = function() {
        if( request.readyState == 1 ) {
            xhrTooLong = setTimeout(function(){
                if(request.readyState == 1){
                    timedOut = true;
                    request.abort();
                    if(options.aborted) options.aborted(true);
                }
            }, timeout);
        }
        if(request.readyState == 4 && !timedOut){
            window.clearTimeout( xhrTooLong );
            if(options.complete) options.complete (true);
            if ( /200|304/.test( request.status ) ) {
                if(options.success) options.success(request.responseText);
            } else {
                if(options.error) options.error(request.status);
            }
        }
    }
    request.setRequestHeader( 'If-Modified-Since', '06 Oct 1970 00:00:00 GMT' );
    if(method.toLowerCase() == "get"){
        request.send( null );
    } else {
        if(!options.contentType){
            request.setRequestHeader( 'Content-type','application/x-www-form-urlencoded; charset=UTF-8' );
        } else {
            request.setRequestHeader( 'Content-type',options.contentType );
        }
        request.setRequestHeader( 'Accepts', '*' );
        request.send( encodeURI( datas ) );
    }
    return false;
}

现在你可以像这样重写showUser：

function showUser() {

    var url= "indexPhp.php";   
    var name= document.getElementById("name").value;
    var age= document.getElementById("age").value;

    var vars = {Name: name, Age: age};

    ajax({
        url: url,
        method: "post",
        data: vars,
        success: function(result){
            alert(result);
            document.getElementById("resultDiv").innerHTML = result;
        },
        error: function(){ alert("Failed!") },
        aborted: function(){ alert("Aborted!") },
        complete: function(){ alert("Complete!") }
    });

}

在关闭ajax调用中的函数括号后，您还可以在几秒钟内传入可选的超时。

Ajax响应文本没有返回任何javascript结果

2 个答案: