держать фокус в том же поле ввода после отправки/ввода

Question

У меня есть следующая форма с полем ввода. Я хочу, чтобы убедиться, что фокус получить набор обратно на тот же вход после ввода/отправки формы:

<form action="https://stackoverflow.com/a/message/new" method="post" id="myform"> 
    <div class="form-group"> 
     <div class="input-group"> 
     <input name="body" id="myField" class="form-control" placeholder="Write message here..." /> <span class="input-group-btn"> 
         <button class="btn btn-default" type="submit" value="{{ _(' Post ') }}">Submit</button> 
         </span> 
     <input type="hidden" name="next" value="{{ request.path }}"> {% module xsrf_form_html() %} 
     </div> 
    </div> 
    </form> 
</div> 

Я попытался сделать следующее:

<script> 
    $(function() { 

     //Start check on form submit 
     $('#myform').submit(function(){  

     $('#myField').focus(); 

     }); 

    });  
</script> 

, но это не сработало

Answer 1

При запуске события submit форма отправит и обновит/изменит страницу, если ее не предотвратить, вы можете предотвратить отправку формы с помощью event.preventDefault();

$("#myForm").submit(function(event) { 
    event.preventDefault(); 
}); 

Это, однако, не означает - как только что упомянуто - отправьте форму, которая не соответствует требованиям, если вы не делаете запрос ajax. Вы можете настроить фокусировку на нагрузке страницы на поле ввода и таким образом «держать» фокус на поле:

$(function() { 
    $('#myField').focus(); 
});