我们可以使用一个Java脚本函数对多个输入进行验证吗？

Question

We created a JavaScript function to validate user name , it is working fine, but if i try to use this function to another input validation at the same jsp page, it is showing only text, i included text color in same function but it is not working in second input validation. is it possible to get?, if yes, how can i get?, i am starting level in java script, pls give your answer if anything, thank you.

for example , this is my js function:

function name_validation()
      {
         if(true){
          var unam=document.getElementById("v2").innerHTML="valid";
          v2.style.color="green"; //this line is not exist in second input validation
                 }
         else{
            var unam=document.getElementById("v2").innerHTML="invalid";
            v2.style.color="red"; //this line is not exist in second input validation
              }
      }

this is my jsp code:

name:<input type="text" id="name" onchange="name_validation();"><a id="v2"></a>
Father name:<input type="text" id="name" onchange="name_validation();"><a id="v2"></a>

Answer 1

You can pass current object like this

name:<input type="text" id="name" onchange="name_validation(this);">
Father name:<input type="text" id="father_name" onchange="name_validation(this);">

then to do (JQuery):

function name_validation(obj) {
var value = $(obj).val();
...
}

for javascript

function name_validation(obj) {
var value = obj.value;
...
}

Answer 2

Try this way hope it helps :

Name:<input type="text" id="name" onchange="name_validation(this.id);">
Father name:<input type="text" id="father_name" onchange="name_validation(this.id);">

function name_validation(id){ 
  if(document.getElementById(id).value == ''){
    alert(id + 'is null');
  }

}

Answer 3

Try following.

Name:<input type="text" id="name" class="validate">
Father name:<input type="text" id="father_name" class="validate">
$(function(){
   $('.validate').on('blur',function(){
      if($(this).val() == '')
      {
         $(this).css({'border-color':'red','background':'somecolor '});
      }
      else{
         $(this).css({'background':'somecolor'});
      }   

   });

});