Tabindex on text input immediately after WordPress title input

The following code adds a text input for a subtitle to the space directly below the title input, via the edit_form_after_title hook. However, when editing the title, pressing tab moves the cursor to the main post editor and I can’t figure out what tabindex I should use (or some other method if available) in order to tab from the title to my subtitle input instead.

add_action( 'edit_form_after_title', 'add_input' );

function add_input(){

    global $post;

    $options = get_option( 'kia_subtitle_options' );

    // only show input if the post type was not enabled in options
    if ( isset ( $options['post_types'] ) && in_array( $post->post_type, $options[ 'post_types'] ) ) {

        //create the meta field (don't use a metabox, we have our own styling):
        wp_nonce_field( plugin_basename( __FILE__ ), 'kia_subnonce' );

        //get the subtitle value (if set)
        $sub = get_post_meta( get_the_ID(), 'kia_subtitle', true );

        // echo the inputfield with the value.
        printf( '<input type="text" class="widefat" name="subtitle" placeholder="%s" value="%s" id="the_subtitle" tabindex="1"/>',
                __( 'Subtitle', 'kia-subtitle'   ),
                 esc_attr($sub) );
     }
}

I found last part of @birgire answer the most useful way, however it breaks the possibility to tab to content. In fact I think is normal focus the content by click tab while in the subtitle field.

To do that, you have also to take care if the content is shown in the “Text” tab or in the “Visual” tab (TynyMCE).

I put the code inline , inside your function, but you can use wp_enqueue_script or add it to some javascript file already enqueued in post edit screen.

add_action( 'edit_form_after_title', 'add_input' );

function add_input(){
  global $post;
  $options = get_option( 'kia_subtitle_options' );
  // only show input if the post type was not enabled in options
  if ( isset ( $options['post_types'] ) && in_array( $post->post_type, $options[ 'post_types'] ) ) {
    //create the meta field (don't use a metabox, we have our own styling):
    wp_nonce_field( plugin_basename( __FILE__ ), 'kia_subnonce' );
    //get the subtitle value (if set)
    $sub = get_post_meta( get_the_ID(), 'kia_subtitle', true );
    // echo the inputfield with the value.
    printf(
      '<input type="text" class="widefat" name="subtitle" placeholder="%s" value="%s" id="the_subtitle" tabindex="1"/>',
      __( 'Subtitle', 'kia-subtitle'   ), esc_attr($sub)
     );
  ?>

  <script>
  (function($) { $(document).on( 'keydown', '#title, #the_subtitle', function( e ) {
  var keyCode = e.keyCode || e.which;
  if ( 9 == keyCode){
    e.preventDefault();
    var target = $(this).attr('id') == 'title' ? '#the_subtitle' : 'textarea#content';
    if ( (target === '#the_subtitle') || $('#wp-content-wrap').hasClass('html-active') ) {
      $(target).focus();
    } else {
      tinymce.execCommand('mceFocus',false,'content');
    }
  }
  }); })(jQuery);
  </script>

<?php
} // endif
} // end function