JSFiddle - React, Tailwind, and code Playground

by kyleshen

HTML

<input type='text' name='txtValue' error-msg='A不能為空白' /><Br/>
<input type='text' name='txtValue' error-msg='B不能為空白' /><Br/>
<input type='text' name='txtValue' error-msg='C不能為空白' /><Br/>
<input type="button" id="btnSubmit" value="Save" onclick="return IsValid();" />
<div id="DivError" style="color:red" ></div>

JavaScript

IsValid = function(){
var inp = document.getElementsByTagName('input');
var div = document.getElementById('DivError');
div.innerHTML = '';
var flag = true; // 紀錄是否驗證成功
  for(var i in inp){
  
    if(inp[i].type == "text"){
       if(inp[i].value==='') {
       div.innerHTML+= '<div>'+inp[i].getAttribute('error-msg')+'<div>';
    }
  }
}
return flag;
};