IE中的JQuery focusOut问题

Question

I have a small problem with focusout function in IE.

I have two fields with the same class and I wrote an empty validation code in jQuery for that class with focusout .

While I focus out of a field which is empty it shows alert and focus to the same field.

While doing that focus, It shows me alert again and again b'coz of the same class.

What to do?

JS:

$(".emptyValidate").focusout(function() {    
var currFocusOut = $(this).attr("inText");
    if($(this).val() == ""){            
      alert(currFocusOut+" should not be Empty");
      document.getElementById(currFocusOut).focus();
    }
});

Markup :

<input type="text" inText="Name" id="Name" class="emptyValidate "/>
<input type="text" inText="Phone" id="Phone" class="emptyValidate "/>

Answer 1

Working Demo

$(".emptyValidate").focusout(function () {
    var currFocusOut = $(this).attr("id");
    if ($(this).val() == "") {
        alert(currFocusOut + " should not be Empty");
        $('#'+currFocusOut).focus();
    }
});

Answer 2

Try to use blur function like,

$(".emptyValidate").blur(function() {    
    var currFocusOut = $(this).attr("inText");
    if($(this).val() == ""){            
      alert(currFocusOut+" should not be Empty");
      document.getElementById(currFocusOut).focus();
    }
});

Read blur()

Or, custom attribute inText may not work, so you can use data in jquery like

<input type="text" data-inText="Name" id="Name" class="emptyValidate "/>
<input type="text" data-inText="Phone" id="Phone" class="emptyValidate "/>

$(".emptyValidate").focusout(function() {  // use blur if not works  
    var currFocusOut = $(this).data("inText");
    if($(this).val() == ""){            
      alert(currFocusOut+" should not be Empty");
      document.getElementById(currFocusOut).focus();
    }
});

Read data()

Answer 3

Try inline function like this:

<input type="text" inText="Name" id="Name" class="emptyValidate"  onfocusout="myFunction(this)"/>
<input type="text" inText="Phone" id="Phone" class="emptyValidate"  onfocusout="myFunction(this)"/>
function myFunction(el){
    var currFocusOut = $(el).attr("inText");
    if($(el).val() == ""){            
      alert(currFocusOut+" should not be Empty");
      document.getElementById(currFocusOut).focus();
    }
}