вернуть цвет фона ввода в исходное состояние при сбросе значений

В моем коде, когда один из параметров превышает его размер, он превратит один из соответствующих текстовых полей результата, я добавил, что это solution by Troelskn очистить все поля HTML, хорошо работает для очистки значений не уверен, что лучший способ, чтобы удалить цвет фона и в то же время, любая помощь оцениливернуть цвет фона ввода в исходное состояние при сбросе значений

<!DOCTYPE html> 
<html lang="en"> 

    <head> 
     <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
     <link rel="style" href="css/main.css" type="text/css" /> 
     <title>Multiple results</title> 
     <script type="text/javascript"> 
      function sum() { 

       numwidth = parseInt(document.multipleresults.width.value); 
       numheight = parseInt(document.multipleresults.height.value); 

       var trackWidth60 = 7.125; 
       var trackWidth80 = 9.375; 
       var trackWidth100 = 11.250; 
       var boxSize8 = 8; 

       var addToOverall = 4; 
       var option1price = 1.00; 
       var option2price = 3.00; 
       var option3price = 6.00; 
       //---------------------------------option1------------------------------------------------------------------ 

       if (numwidth >= 12 && numwidth <= 150) var sixty60width = (numwidth) + (trackWidth60); 

       if (numheight >= 12 && numheight <= 55) var sixty60height = (numheight) + (boxSize8) + (addToOverall); 

       var option60 = ((sixty60width) * (sixty60height)/144) * (option1price); 

       if (isNaN(option60)) document.getElementById("result1").style.backgroundColor = "red"; 
       //   document.getElementById("result1").readOnly=true;   
       else document.getElementById('result1').value = "$" + (option60).toFixed(2); 
       //   document.getElementById("result1").readOnly=true;  

       //---------------------------------option2------------------------------------------------------------------ 

       if (numwidth >= 12 && numwidth <= 200) var e80width = (numwidth) + (trackWidth80); 

       if (numheight >= 12 && numheight <= 105) var e80height = (numheight) + (boxSize8) + (addToOverall); 

       var option80 = ((e80width) * (e80height)/144) * (option2price); 

       if (isNaN(option80)) document.getElementById("result2").style.backgroundColor = "red"; 
       //   document.getElementById("result2").readOnly=true;   
       else document.getElementById('result2').value = "$" + (option80).toFixed(2); 
       //   document.getElementById("result2").readOnly=true;  


       //---------------------------------option3------------------------------------------------------------------ 

       if (numwidth >= 12 && numwidth <= 250) var o100width = (numwidth) + (trackWidth100); 

       if (numheight >= 12 && numheight <= 155) var o100height = (numheight) + (boxSize8) + (addToOverall); 

       var option100 = ((o100width) * (o100height)/144) * (option3price); 

       if (isNaN(option100)) document.getElementById("result3").style.backgroundColor = "red"; 
       //   document.getElementById("result3").readOnly=true;   
       else document.getElementById('result3').value = "$" + (option100).toFixed(2); 
       //   document.getElementById("result3").readOnly=true; 
      } 


      //---------------------------------option clear all------------------------------------------------------------------ 

      function clearall() { 

       var elements = document.getElementsByTagName("input"); 
       for (var ii = 0; ii < elements.length; ii++) { 
        if (elements[ii].type == "text") { 
         elements[ii].value = ""; 
        } 
       } 
      } 
     </script> 
    </head> 

    <body> 
     <div> 
       <H2> Multiple results calculator!</h2> 

     </div> 
     <form name="multipleresults"> 
      <div> 
       <label for="width">Width:</label> 
       <input type="text" name="width" maxlength="5" size="10" value="" /> 
       <label for="height">Height:</label> 
       <input type="text" name="height" maxlength="5" size="10" value="" /> 
       <input type="button" name="button" Value="calculate" onclick="sum()" /> 
       <input type="button" name="clearValue" value="Clear all fields" onclick="clearall()"> 
      </div> 
      <div> 
       <br> 
       <label for="result1">Option1:</label> 
       <input type="text" id="result1" name="result1" maxlength="6" size="10" value="" /> 
       <label for="result2">Option2:</label> 
       <input type="text" id="result2" name="result2" maxlength="6" size="10" value="" /> 
       <label for="result3">Option3:</label> 
       <input type="text" id="result3" name="result3" maxlength="6" size="10" value="" /> 
      </div> 
     </form> 
    </body> 

</html>

источник

2013-11-24 bigdog

Все, что вам нужно сделать, чтобы очистить background-color это добавить

elements[ii].style.backgroundColor = '';

К вашему clearall(); петли

function clearall() { 

    var elements = document.getElementsByTagName("input"); 
    for (var ii = 0; ii < elements.length; ii++) { 
     if (elements[ii].type == "text") { 
      elements[ii].value = ""; 
      elements[ii].style.backgroundColor = 'transparent'; 
     } 
    } 
}

Here is an example

источник

2013-11-24 02:54:32

, что это именно то, что я искал, спасибо – bigdog

начал получать Msgstr "Ошибка при анализе значения для" background-color ". в FX изменен на элементы [ii] .style.backgroundColor = 'transparent'; как и Don Goodspeed, похоже, сейчас работает отлично на FX, IE – bigdog

Я думаю, что вы ищете

background-color:transparent;

это удалит красный цвет.

источник

2013-11-24 02:29:33

вернуть цвет фона ввода в исходное состояние при сбросе значений

ответ

Смежные вопросы