Ajax ou JavaScript: Changement de style en fonction de la réponse du serveur

Question

Hey, je voudrais changer la couleur de la police ou le responseText basé sur le résultat. Par exemple, si le responseText n'est pas trouvé, j'aimerais que la couleur de la police soit rouge. Sinon, ce sera noir. Il affiche actuellement le bon responseText; Je veux juste changer la couleur si nécessaire. Voici mon actuelle Ajax:

function newXMLHttpRequest() 
    { 
    var xmlreq = false; 
    if (window.XMLHttpRequest) 
    { 
     xmlreq = new XMLHttpRequest(); 
    } 
     else if (window.ActiveXObject) 
    { 
     try 
     { 
      xmlreq = new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
      catch (e2) 
      { 
       alert("Error: Unable to create an XMLHttpRequest."); 
      } 
     } 
     return xmlreq; 
    } 
    function getLocation(location) 
    { 
    var getLocation= newXMLHttpRequest(); // sending request 
    getLocation.open("GET", "/PP?PAGE=GETLOCATIONNAME&ROUTINGNUM=" + location, false); 
    getLocation.send(null); // getting location 
    document.getElementById("location_div").innerHTML = getLocation.responseText; 
    } 

Le responseText sera dans une table dans le code HTML:

    <tr> 
         <td class="ajax_msg"> 
          <div id="location_div"></div>       
         </td> 
         <td>&nbsp;</td> 
        </tr> 
        <tr> 
         <td> 
          <div class="column1"> 
           <p class="label_top"> 
*Routing Number</p> 
           <p class="field_top"><input type="text" id="location" name="location" size="28" maxlength="9" onblur="getLocation(this.value);" /></p> 

Toutes les suggestions sont les bienvenus. Merci d'avance!

Answer 1

Modifier votre code comme ceci:

function getLocation(location) 
    { 
    var getLocation= newXMLHttpRequest(); // sending request 
    getLocation.open("GET", "/PP?PAGE=GETLOCATIONNAME&ROUTINGNUM=" + location, false); 
    getLocation.send(null); // getting location 

    var dv = document.getElementById("location_div"); 

    if (getLocation.responseText === 'NOT FOUND'){ 
     dv.style.color = "red"; 
    } 

    dv.innerHTML = getLocation.responseText; 
    } 

Vous vérifiez essentiellement le texte de réponse en état avec:

if (getLocation.responseText === 'NOT FOUND'){ 

Et changer sa couleur en utilisant style comme ceci:

dv.style.color = "red"; 

Notez que dv variable représente le div où vous allez montrer le respo texte nes qui a été plus rapprochée avec cette ligne:

var dv = document.getElementById("location_div"); 

Mise à jour:

Essayez avec la condition d'autre parce que vous avez peut-être la couleur rouge par défaut:

if (getLocation.responseText === 'NOT FOUND'){ 
    dv.style.color = "red"; 
} 
else { 
    dv.style.color = "black"; 
}