0

我有一个表单，在前 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);
    }
}
4

2 回答 2

1

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

于 2013-09-19T12:12:47.120 回答
0

在 startAjax 之外添加一个变量，如“检查”，当您等待来自数据库的响应时，您将设置为“真” - 一旦收到响应，将其设置为“假”。然后，在您调用数据库的代码中，检查您是否已经在等待响应（如果是，则完全跳过调用）

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

于 2013-09-19T11:47:44.863 回答