manually trigger focus on input Iphone issue

Question

I am trying to focus a textarea after a click on a another element. desktop browsers seems to be working fine but not the Iphone.

$(\'.reveal_below\').on(\'c         


        

Answer 1

You have to use touchstart event to fix this issue.

$(document).ready(function() {

  $('button').on('click', function() {
    $('#x').css({
      'margin-top': '0px',
      display: 'block',
      opacity: '0'
    }).animate({
        'margin-top': '15px',
        opacity: '1'
      },
      100
    )

    $('#x').trigger('touchstart'); //trigger touchstart
  });

  $('textarea').on('touchstart', function() {
    $(this).focus();
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>


<textarea id="x" style="width: 100%;height:6em;display: none" placeholder="Return notes..." cols="30" rows="10"></textarea>

<button type="button">focus textarea</button>