Auto select an element and focus out of the element jquery

Question

I need to select an element automatically and then quickly focus out of it too.

Here's my HTML:

<div class='input-group date' id='join_date'>
  <input type='text' class="form-control dateField" name="join_date" placeholder="MM/DD/YYYY" data-toggle="tooltip" data-placement="top" value="" />
  </span>
</div>

I tried putting in focus into the element but don't know how to focus out of it.

unhighlight: function(element, errorClass, validClass)
    {
      if($(element).hasClass('select2-offscreen'))
      {
        $(element).closest('.form-group').removeClass('has-error');
        $(element).next('span').css({display: "none"});
      }
      else if($(element).hasClass('dateField'))
      {
         $(element).select();
         //I need to focus out of this element quickly.. there's a reason
      }
      else
      {
        $(element).closest('.form-group').removeClass('has-error');
      }   
    },

How can I achieve auto-focusing out of the element? Please help me.

Allman style code format for JavaScript is not standard a practice; nor is it a good practice: https://stackoverflow.com/a/11247362/594235 — Sparky, Nov 02 '17 at 03:06

score 1 · Accepted Answer · edited Nov 02 '17 at 03:06

You can use jQuery blur()

function, it will remove the focus out of the focused element.

$("#focus").click(function(){
  $("input").focus();
});

$("#blur").click(function(){
  $("input").blur();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='input-group date' id='join_date'>
  <input type='text' class="form-control dateField" name="join_date" placeholder="MM/DD/YYYY" data-toggle="tooltip" data-placement="top" value="" />
</div>

<button id="focus">Focus</button>
<button id="blur">Blur (Focus Out)</button>

Auto select an element and focus out of the element jquery

1 Answers1