响应div在ajax请求后不断消失

Question

我正在构建在线计算器，并试图通过AJAX发送值以通过php脚本处理它们。来自服务器的响应设置为div，但该div在显示后立即消失。我的Ajax代码是：

function get_XmlHttp() { 
    // create the variable that will contain the instance of the XMLHttpRequest object   (initially with null value) 
    var xmlHttp = null; 

    if(window.XMLHttpRequest) {  // for Forefox, IE7+, Opera, Safari, ... 
    xmlHttp = new XMLHttpRequest(); 
    } 
    else if(window.ActiveXObject) { // for Internet Explorer 5 or 6 
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    return xmlHttp; 
} 
function ajaxrequest(php_file, tagID) { 
    var request = get_XmlHttp();  // calls the function for the XMLHttpRequest instance 

    // gets data from form fields, using their ID 
    var c1 = document.getElementById('c1').value; 
    var c2 = document.getElementById('c2').value; 
    var c3 = document.getElementById('c3').value; 
    var c4 = document.getElementById('c4').value; 
    var c5 = document.getElementById('c5').value; 
    var c6 = document.getElementById('c6').value; 


    // create pairs index=value with data that must be sent to server 
    var the_data = 'c1='+c1+'&c2='+c2+'&c3='+c3+'&c4='+c4+'&c5='+c5+'&c6='+c6; 

    request.open("POST", php_file, true);   // sets the request 

    // adds a header to tell the PHP script to recognize the data as is sent via POST 
    request.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    request.send(the_data);  // sends the request 

    // Check request status 
    // If the response is received completely, will be transferred to the HTML tag with tagID 
    request.onreadystatechange = function() { 
    if (request.readyState == 4) { 
     document.getElementById("ajaxform").submit(); 
     document.getElementById(tagID).innerHTML = request.responseText; 


    } 
    } 
} 

请注意，我用的引导CSS框架的实际现场和响应DIV未施加任何类。

感谢

Answer 1

在你onreadystatechange处理程序中，你提交表单，这是造成页面提交（因此该页面更改）。

request.onreadystatechange = function() { 
    if (request.readyState == 4) { 
     document.getElementById("ajaxform").submit(); // <-- ? 
     document.getElementById(tagID).innerHTML = request.responseText; 
    } 
} 

你又看到了同样的页面，这意味着形式ajaxform没有action集。