Javascript会间歇性地失败，但在页面刷新时可以正常工作

Javascript fails intermittently but works when page is refreshed

本文关键字：刷新 常工作 工作 失败 Javascript      更新时间：2023-09-26

我有javascript来显示和隐藏我的页面的各个部分:

function showCustomer(str) {
    // remove white space from the name entered on the search screen
    str = str.replace(" ", "%20");
    var xmlhttp;
    if (str == "") {
        document.getElementById("txtHint").innerHTML = "No records found";
        return;
    }
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET", "get_customer.asp?q=" + str, true);
    xmlhttp.send();
}
function enable_submit() {
    document.getElementById("id_simplesearch_submit").style.visibility = "visible";
    document.getElementById("autocomplete-search").reset();
    document.getElementById("txtHint").style.display = "none";
    document.getElementById("results").style.visibility = "visible";
}
function disable_submit() {
    document.getElementById("id_simplesearch_submit").style.visibility = "hidden";
    document.getElementById("id_simplesearch").reset();
    document.getElementById("txtHint").style.visibility = "visible";
    document.getElementById("results").style.display = "none";
}
我有一个带有 的文本框
onkeyup="showCustomer(this.value)"

和

onfocus="disable_submit()"

和定义为

的表单
    <div class="commandspace">
    <form id="id_simplesearch" name="simplesearch" method="post" action="index.asp">
    <div class="simplesearch"><label for="forename">Forename</label><input type="text" id="id_forename" name="forename" onfocus="enable_submit()" /></div>
    <div class="simplesearch"><label for="surname">Surname</label><input type="text" id="id_surname" name="surname" onfocus="enable_submit()" /></div>
    <div class="simplesearch"><label for="unit">Unit/Team</label><input type="text" id="id_unit" name="unit" onfocus="enable_submit()" /></div>
    <div id="simplesearchsubmit">
    <div class="simplesearch">
    <input class="simplesearchsubmit" type="submit" id="id_simplesearch_submit" name="search" value="Search" />

当您第一次加载页面并开始在showCustomer搜索框中输入时，txtHint元素将显示并开始提取数据。但是，如果单击三个simplesearch框中的一个，然后单击返回到showCustomer搜索框，则txtHint根本不显示。

问题在这里(见注释):

function enable_submit() {
    document.getElementById("id_simplesearch_submit").style.visibility = "visible";
    document.getElementById("autocomplete-search").reset();
    document.getElementById("txtHint").style.display = "none"; // <----- This uses display
    document.getElementById("results").style.visibility = "visible";
}
function disable_submit() {
    document.getElementById("id_simplesearch_submit").style.visibility = "hidden";
    document.getElementById("id_simplesearch").reset();
    document.getElementById("txtHint").style.visibility = "visible"; // <----- This uses visibility
    document.getElementById("txtHint").style.display = "block"; // <----- This line should fix your problems.
    document.getElementById("results").style.display = "none";
}

所以enable_submit使用display隐藏元素。而disable_submit试图使用可见性来显示它。两个样式属性不匹配

相关文章：