JavaScript XML Search - 如果未找到匹配项,则显示消息

时间:2013-06-11 09:52:08

标签: javascript xml search loops match

我有一个html文件,其中包含一个输入第一个名称的输入框。单击此按钮,将运行一个JavaScript函数,该函数将加载XML文件以查看是否存在任何匹配项。如果有匹配项,则它们将显示在具有匹配联系信息的表中。我可以做得很好。

但如果没有匹配,我还需要显示警告。那就是“如果联系人不存在”。

现在,我的代码中的for循环混淆了innerHTML,这很公平,它一遍又一遍地循环特定代码,因此解析了内部的任何代码。这就是innerHTML在循环之外的原因。

但是如果没有联系人,我想在调用表之前显示一条消息。

这可能是非常简单的事情,但它又一整天都在回避我。

继承我的代码:

<script language="JavaScript" type="text/javascript">
function loadXMLDoc(dname)
{
    if (window.XMLHttpRequest)
    {
        xhttp=new XMLHttpRequest();
    }
    else
    {
        xhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xhttp.open("GET",dname,false);
    xhttp.send();
    return xhttp.responseXML;
} 
function searchXML()
{
    xmlDoc=loadXMLDoc("Contact.xml");
    x=xmlDoc.getElementsByTagName("firstname");
    input = document.getElementById("input").value;
    size = input.length;
    divText =  "<table border=1><tr><th>First Name</th><th>Last Name</th><th>Phone</th><th>Street</th><th>City</th><th>State</th><th>Postcode</th></tr>";
    if (input == null || input == "")
    {
        document.getElementById("results").innerHTML= "Please enter a character or name!";
        return false;
    }
    for (i=0;i<x.length;i++)
    {
        startString = firstname.substring(0,size);
        if (startString.toLowerCase() == input.toLowerCase())
        {
            firstname=xmlDoc.getElementsByTagName("firstname")[i].childNodes[0].nodeValue;
            lastname=xmlDoc.getElementsByTagName("lastname")[i].childNodes[0].nodeValue;
            phone=xmlDoc.getElementsByTagName("phone")[i].childNodes[0].nodeValue;
            street=xmlDoc.getElementsByTagName("street")[i].childNodes[0].nodeValue;
            city=xmlDoc.getElementsByTagName("city")[i].childNodes[0].nodeValue;
            state=xmlDoc.getElementsByTagName("state")[i].childNodes[0].nodeValue;
            postcode=xmlDoc.getElementsByTagName("postcode")[i].childNodes[0].nodeValue;
            divText = divText + "<tr><td>" + firstname + "</td><td>" + lastname + "</td><td>" + phone + "</td><td>" + street + "</td><td>" + city + "</td><td>" + state + "</td><td>" + postcode + "</td></tr>";
            }
    }
    //insert does not exist code here
    document.getElementById("results").innerHTML= "<h2>The contact does not exist.</h2>";
    return false;
    //end insert
    divText =  "<h1>The contact details are:</h1><br />" + divText + "</table>";
    document.getElementById("results").innerHTML= divText;
}
</script>

我的HTML身体:

<body>
First Name: <input type="text" name="firstname" id="input">
<br />
<input type="submit" value="Submit" onClick="searchXML()">
<br />
<br />
<div id="results">
</div>
</body>

我感谢任何帮助。

由于

1 个答案:

答案 0 :(得分:0)

我解决了我的问题。问题是即使没有联系,也会显示包含表数据的divText。

for循环中有一个if else语句。请参阅下面的完整工作代码。

<script language="JavaScript" type="text/javascript">
function loadXMLDoc(dname)
{
    if (window.XMLHttpRequest)
    {
        xhttp=new XMLHttpRequest();
    }
    else
    {
        xhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xhttp.open("GET",dname,false);
    xhttp.send();
    return xhttp.responseXML;
} 
function searchXML()
{
    xmlDoc=loadXMLDoc("Contact.xml");
    x=xmlDoc.getElementsByTagName("firstname");
    input = document.getElementById("input").value;
    size = input.length;
    if (input == null || input == "")
    {
        document.getElementById("results").innerHTML= "Please enter a character or name!";
        return false;
    }
    for (i=0;i<x.length;i++)
    {
        startString = firstname.substring(0,size);
        if (startString.toLowerCase() == input.toLowerCase())
        {
            firstname=xmlDoc.getElementsByTagName("firstname")[i].childNodes[0].nodeValue;
            lastname=xmlDoc.getElementsByTagName("lastname")[i].childNodes[0].nodeValue;
            phone=xmlDoc.getElementsByTagName("phone")[i].childNodes[0].nodeValue;
            street=xmlDoc.getElementsByTagName("street")[i].childNodes[0].nodeValue;
            city=xmlDoc.getElementsByTagName("city")[i].childNodes[0].nodeValue;
            state=xmlDoc.getElementsByTagName("state")[i].childNodes[0].nodeValue;
            postcode=xmlDoc.getElementsByTagName("postcode")[i].childNodes[0].nodeValue;
            divText = "<h1>The contact details are:</h1><br /><table border=1><tr><th>First Name</th><th>Last Name</th><th>Phone</th><th>Street</th><th>City</th><th>State</th><th>Postcode</th></tr>" + "<tr><td>" + firstname + "</td><td>" + lastname + "</td><td>" + phone + "</td><td>" + street + "</td><td>" + city + "</td><td>" + state + "</td><td>" + postcode + "</td></tr>" + "</table>";
            break;
        }
        else
        {
            divText = "<h2>The contact does not exist.</h2>";
        }
    }
    document.getElementById("results").innerHTML= divText;
}
</script>

我希望这可以帮助其他人