多个JavaScript确认

Multiple javascript confirms

本文关键字:确认 JavaScript 多个      更新时间:2023-09-26

>我有一个表单,在前 3 个输入字段(fname、lname、addr)上有一个 onkeyup 函数,它根据数据库检查输入值。如果存在单个匹配项,该函数将提供一个弹出窗口(javascript confirm),询问数据库中的记录是否正确,如果是,则将预填充字段。

问题是,大多数人打字的速度比函数检查的速度快。如果函数找到与"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);
    }
}

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

在startAjax之外添加一个变量,例如"checking",当您等待来自数据库的响应时,该变量将设置为"true" - 收到响应后,将其设置为"false"。然后,在调用数据库的代码点,检查您是否已经在等待响应(如果是,则完全跳过调用)

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