js控制輸入框邊框的顏色顯示

當輸入框內容爲空的時候，讓內容爲空的輸入框，邊框設爲紅色，同時再次獲得焦點是，恢復原來顏色

css:

<style type="text/css">
       .redBorder{
           border:#ff0000 1px solid
       }#000000
       .blackBorder{
        border:#000000 1px solid
       }
    </style>

html:

<table id="tabID" >

  <tbody id="specialBudgetInfoList">

<tr>

<td>

<input type='text' id='testID' name='test' style='text-align: right' οnfοcus='blackBorder(this)'/>

</td>

</tr>

</tbody>

</table>

js: /**
  * 檢查輸入值是否填完整
  */
  function checkInputsValue(id){
  var tbodyNode = document.getElementById(id);
  var flag = true;
  var inputNodes = tbodyNode.getElementsByTagName("input");
  for(var i=0;i<inputNodes.length;i++){
 
  if(inputNodes[i].type == 'text'){
  //將input標籤的type爲text，並且值爲空的，設置邊框爲紅色
  if(inputNodes[i].value == " " || inputNodes[i].value == ""){
  inputNodes[i].className = "redBorder";  //方框設爲紅色，默認是爲黑色的
  flag = false;
  }
  }
  }
  return flag;
  }
 
  //黑色邊框
  function blackBorder(obj){
  obj.className = "blackBorder";
  }

//提交方法

function submitInfo(){

if(checkInputsValue("specialBudgetInfoList") == false){

alert("請輸入內容");

return;

}

}

變爲