【问题标题】:Ajax or JavaScript: Changing Style According to Server ResponseAjax 或 JavaScript:根据服务器响应更改样式
【发布时间】:2010-08-09 19:12:51
【问题描述】:

嘿,我想根据结果更改字体颜色或 responseText。例如,如果未找到 responseText,我想将字体颜色设置为红色。否则,它将是黑色的。它当前正在显示正确的 responseText;我只想在必要时更改颜色。这是我当前的 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;
  }

responseText 将在 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> 

欢迎提出任何建议。提前致谢!

【问题讨论】:

    标签: javascript ajax coding-style responsetext


    【解决方案1】:

    像这样修改你的代码:

      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;
      }
    

    您基本上检查响应文本的条件:

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

    然后像这样使用style 改变它的颜色:

    dv.style.color = "red";
    

    请注意,dv 变量表示您将在其中显示之前使用此行设置的响应文本的 div:

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

    更新:

    尝试使用 else 条件,因为您可能默认为红色:

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

    【讨论】:

    • 感谢您的回复。不知道为什么,但它不工作。如果我像这样注释掉对响应的检查: function getLocation(location) { var getLocation= newXMLHttpRequest(); getLocation.open("GET", "/PP?PAGE=GETLOCATIONNAME&ROUTINGNUM=" + location, false); getLocation.send(null); var dv = document.getElementById("location_div"); //if (getLocation.responseText == 'NOT FOUND') //{ dv.style.color = "red"; //} dv.innerHTML = getLocation.responseText; } THEN 字体是红色的。到目前为止一切顺利。
    • 但是,如果我不这样注释掉它: function getLocation(location) { var getLocation= newXMLHttpRequest(); getLocation.open("GET", "/PP?PAGE=GETLOCATIONNAME&ROUTINGNUM=" + location, false); getLocation.send(null); var dv = document.getElementById("location_div"); if (getLocation.responseText == 'NOT FOUND') { dv.style.color = "red"; } dv.innerHTML = getLocation.responseText; } THEN 字体保持黑色。有什么想法为什么不应用该样式?
    • 你这个男人!它正在工作。 (这是我的错,因为响应是 LOCATION NOT FOUND,而不是 NOT FOUND。)感谢您的帮助。
    猜你喜欢
    • 2017-09-16
    • 2022-07-22
    • 1970-01-01
    • 1970-01-01
    • 2014-09-21
    • 1970-01-01
    • 2017-06-10
    • 1970-01-01
    • 2018-09-13
    相关资源
    最近更新 更多