ajax XMLHttpRequest 就绪状态答案

【问题标题】：ajax XMLHttpRequest readystateajax XMLHttpRequest 就绪状态
【发布时间】：2012-12-14 04:59:22
【问题描述】：

我有一个带有此表单的 html 页面

<form id="quick-search" autocomplete="off" class="form-wrapper cf" >
    <div style="text-align: center;">
    <input id="qsearch" name="qsearch" onkeyup="liveSearch()" placeholder="Search here..." required="" type="text">
    <button  onclick='ajaxFunction()' id="submitButton">Search</button>
    </div>`

还有这个div，我把ajaxFunction的结果放在这里

<div id='ajaxDiv'>Your result will display here</div>

当我单击按钮时，ajaxFunction 执行。只需打开一个 php 文件，我在其中进行 sql 查询，因为用户在 qsearch 输入表单中写入它。下面是 JavaScript 代码：

function createRequestObject(){
var request_o;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
    request_o = new ActiveXObject("Microsoft.XMLHTTP");
}else{
    request_o = new XMLHttpRequest();
}
return request_o;
}

var http = createRequestObject()
function ajaxFunction(){

// Create a function that will receive data sent from the server
http .onreadystatechange = function(){
    try{
        if(http .readyState == 4){
            if(http .status==200){
            try{
                var ajaxDisplay = document.getElementById('ajaxDiv');
                ajaxDisplay.innerHTML= http .responseText;
                }catch(err){
                    // display error message
                    alert("Error reading the response: " + err.toString());
                return false;
                }
            }
        }
        else{
            alert(http .readyState+" "+http .status);
        }
    }catch(e){
        alert('Caught Expection: '+e.description+' '+http .status);
        return false;
    }
}
var par = document.getElementById('qsearch').value;
var queryString = "?par=" + par;
http.open("GET", "results3.php" + queryString, true);
http.send(null); 
}

代码运行良好，但问题是我需要单击按钮两次（当然输入字段中的文本相同）才能使结果文本保留在 div 中。第一次单击相同的结果，但页面自动刷新和结果（以及输入表单中的文本）消失。第二次单击页面不刷新显示没问题。通过代码中的警报，我可以看到 readyState 和状态.产生的状态，状态是 1,0->2,200->3,200->1,0。在页面上显示的状态 3 和 1 之间的结果（显然状态 4 没有问题）但是为什么我在 4 之后有状态 1？所有这些都在 Firefox 17.0.1 中提前感谢您的帮助！

【问题讨论】：

您需要该表格吗？看起来您的提交按钮也提交了表单，刷新了页面本身，因为您没有通知其target 属性
我至少工作了一天，我在发布问题 10 分钟后找到了解决方案！答案就在这里 [停止使用 ajax 、 javascript 、 php 刷新][1] [1]：stackoverflow.com/questions/10383810/… 我只需要在此处添加 return false ：onclick='ajaxFunction();return false' 现在它可以完美运行了！谢谢！
哦，酷你发现了！
我认为表格不是问题。如果我有方法 -post 可能。但你可能更清楚，我是这种编程的新手。无论如何，谢谢你的时间。问题解决了！
对于程序员来说，无论是初学者还是高级程序员，编程总是新鲜的......

标签： php html debugging xmlhttprequest readystate

【解决方案1】：

我至少工作了一天，我在发布问题 10 分钟后找到了解决方案！答案就在这里 [停止使用 ajax 、 javascript 、 php 刷新][1] [1]: Stop refreshing with ajax , javascript , php... 我只需要在此处添加 return false ： onclick='ajaxFunction();return false' 现在它可以完美运行了！谢谢！

【讨论】：