Когда я открываю этот модал, мне нужно подвести курсор к текстовому полю с помощью мыши
Файлы Css и JS
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
Код Javascript
<script type="text/javascript"> $(document).ready(function(){ $('.launch-modal').click(function(){ $('#myModal').modal({ backdrop: 'static' }); // document.form1.focushere.focus(); }); }); </script>
HTML-код
<body> <form name="form1"> <!-- Button HTML (to Trigger Modal) --> <input type="button" class="btn btn-lg btn-primary launch-modal" value="Launch Demo Modal"> <!-- Modal HTML --> <div id="myModal" class="modal fade"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title">Confirmation Box</h4> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> </div> <div class="modal-body"> <input type="text" id="" name="focushere"> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <button type="button" class="btn btn-primary">Save changes</button> </div> </div> </div> </div> </form> </body> </html>
По сути, это не работает, потому что модальный не загружен, поэтому нет никакого поля, которое Javascript мог бы держать.
Вы можете изменить код, чтобы сделать что-то вроде этого:
$('#myModal').on('shown.bs.modal', function() { document.form1.focushere.focus(); })
Он запустит функцию фокусировки (), когда модал загружен.
См. Этот ответ: Начальная загрузка Twitter - Сосредоточьтесь на текстовой области внутри модального при клике