Question

我有一个表单，在前3个输入字段（fname，lname，addr）上有一个onkeyup函数，用于检查数据库的输入值。如果只有一个匹配项，该函数会提供一个弹出窗口（javascript确认），询问数据库中的记录是否正确，如果是，则预先填充字段。

问题是，大多数人可以输入比功能更快的类型。如果函数找到与“smi”匹配但用户在弹出之前键入“smith”，则确认将连续出现3次。

可以做些什么？

这是我尝试过的，没有运气

    function startAjax(){
    if(document.getElementById("flag").value == "yes"){
        if (window.XMLHttpRequest){ xmlhttpp=new XMLHttpRequest(); }else{ xmlhttpp=new ActiveXObject("Microsoft.XMLHTTP"); }
        xmlhttpp.onreadystatechange=function(){
            if(xmlhttpp.readyState==4 && xmlhttpp.status==200){
                    var status = xmlhttpp.responseXML.getElementsByTagName('status')[0].firstChild.nodeValue;
                    var fname = xmlhttpp.responseXML.getElementsByTagName('fname')[0].firstChild.nodeValue;
                    var addr = xmlhttpp.responseXML.getElementsByTagName('addr')[0].firstChild.nodeValue;
                    var lname = xmlhttpp.responseXML.getElementsByTagName('lname')[0].firstChild.nodeValue;
                    var city = xmlhttpp.responseXML.getElementsByTagName('city')[0].firstChild.nodeValue;
                    var state = xmlhttpp.responseXML.getElementsByTagName('street')[0].firstChild.nodeValue;
                    var zip = xmlhttpp.responseXML.getElementsByTagName('zip')[0].firstChild.nodeValue;
                    var email = xmlhttpp.responseXML.getElementsByTagName('email')[0].firstChild.nodeValue;

                    document.getElementById("ajax_status").innerHTML=status;
                    if(status == "Found user"){
                        document.getElementById('pop_display').style.display = "block";
                        var confirmMsg = "*User Found*\n\nName: "+fname+" "+lname+"\nAddress: "+addr+"\nCity: "+city+"\nState: "+state+"\nZip: "+zip+"\nEmail: "+email+"\n\nClick 'OK' To populate fields or click 'Cancel' if this is not the correct info.";
                        var fillOrNot = confirm(confirmMsg);
                        if(fillOrNot === true){                     
                            document.getElementById('fname').value = fname;
                            document.getElementById('lname').value = lname;
                            document.getElementById('address').value = addr;
                            document.getElementById('city').value = city;
                            document.getElementById('state').value = state;
                            document.getElementById('zip').value = zip;
                            document.getElementById('email').value = email.trim();
                            document.getElementById('flag').value="no";
                        }else{
                            document.getElementById('flag').value="yes2";
                            document.getElementById("ajax_status").innerHTML="Aborted";
                        }
                        document.getElementById('pop_display').style.display = "none";
                    }                   
            }
        }
        var param1 = document.getElementById('fname').value;
        var param2 = document.getElementById('lname').value;
        var param3 = document.getElementById('address').value;
        var url = "https://www.mywebsite.com/ajaxhandler.php?fname="+param1+"&lname="+param2+"&addr="+param3;
        xmlhttpp.open("GET",url,true);
        xmlhttpp.send(null);
    }
}

Answer 1

使用jQuery的'blur'或'onfocusout'而不是'onkeyup'

Answer 2

在startAjax之外添加一个变量，比如'checking'，当你等待数据库的响应时，你将设置为'true' - 一旦你收到了响应，就把它设置为'false'。然后，在您调用数据库的代码中，检查您是否已经在等待响应（如果是，只需完全跳过该调用）

它还有助于将第一个呼叫延迟一点，例如100毫秒，因此用户可以在它之前输入几个字符 - javascript timeout将完成这项工作。

多个javascript确认

2 个答案: