CODEWITHSUNDEEP
jqueryblur
JorisW
JorisW

Reputation: 128

jQuery focus after blur() last form field

Following code should focus the first form element after blurring the last one ,but this is not happening:

<script>
$(document).ready(function(){
  $("#last").blur(function(){
     $("#first").focus();
  });
});
</script>
<form>
<input type="text" name="first" id="first"><br><br>
<input type="text" name="last" id="last">
</form>

If I add another form element after #last, it's working correctly, see below

<script>
$(document).ready(function(){
  $("#last").blur(function(){
     $("#first").focus();
  });
});
</script>
<form>
<input type="text" name="first" id="first"><br><br>
<input type="text" name="last" id="last">
<input type="text" name="dummy">
</form>

Upvotes: 2

Views: 2726

Answers (3)

Deleteman
Deleteman

Reputation: 8700

Here is a fix for you, it's working here:

$(document).ready(function(){
  $("#last").blur(function(){
     $("#first").focus();
  });
    $("#last").keydown(function(e) {
         if(e.keyCode == 9) {
            $("#first").focus();
            return false;
        }
    });
});

Upvotes: 1

Muhammad Usman
Muhammad Usman

Reputation: 12503

As @Deleteman said in the comment:

It works for me if I click out of the second field, not if I tab out, but I think that's because with tab, it ends up jumping into another frame.

He is right, and I have a solution for you.

Here is the safe solution:

$(document).ready(function(){
    $("#last").keydown(function(e){
        if(e.keyCode==9)
        {
            e.preventDefault();
            $("#first").focus();
        }
    });
  $("#last").blur(function(e){
     $("#first").focus();
  });
});

Demo: http://jsfiddle.net/uGudk/

Upvotes: 1

Dau
Dau

Reputation: 8858

thow this it is working fine maybe you are not including jquery in your code

Upvotes: -1

Related Questions