Настройка фокуса внутри текстового поля не работает

У меня есть следующий код:Настройка фокуса внутри текстового поля не работает

<div class="modal-body"> 
    <div class="form-group" id="checkDiv_0"> 
    <div class="col-md-2 control-label"> 
     @Translations.ReportCopy 
    </div> 
    <div class="col-md-10"> 
     <div class="col-md-1"> 
      <button class="btn btn-primary pull-right"><span class="glyphicon glyphicon-remove"></span></button> 
     </div> 
     <div class="col-md-11"> 
      <textarea id="textarea_0" name="Copies" class="form-control textarea-resize"></textarea> 
     </div> 
    </div> 
</div> 
<div class="form-group" id="checkDiv_1"> 
    <div class="col-md-2 control-label"> 
     @Translations.ReportCopy 
    </div> 
    <div class="col-md-10"> 
     <div class="col-md-1"> 
      <button class="btn btn-primary pull-right"><span class="glyphicon glyphicon-remove"></span></button> 
     </div> 
     <div class="col-md-11"> 
      <textarea id="textarea_1" name="Copies" class="form-control textarea-resize"></textarea> 
     </div> 
    </div> 
</div>

Я хочу, чтобы установить фокус на textare с идентификатором textarea_1. Без фокуса пользователь должен щелкнуть левой кнопкой мыши в текстовом поле, а затем начать писать внутри него.

Я пробовал с $('#textarea_1').focus(), но безуспешно.

РЕШЕНИЕ: Я решил проблему так:

$(document).ready(function() { 
    $('#modal').on('shown.bs.modal', 
    function() { 
     var element = document.getElementById("textarea_0"); 
     element.focus(); 
    }); 
});

источник

2015-10-10 user576914

Где/как/когда вы звоните '$ ('# textarea_1') фокус()'? Вероятно, вы звоните ему рано. Разве вы не читали учебник jQuery? https://learn.jquery.com/about-jquery/how-jquery-works/#launching-code-on-document-ready –

Вы хотите, чтобы у него был фокус при загрузке документа? – www139

-1

код необходимо действительно зависит от того, когда вы должны дать ему фокус. Если вам нужно сосредоточиться, когда страница загружается, вы должны сделать то, что предложил @David Li.

В противном случае вы можете сделать что-то подобное.

document.getElementById('focusButton').onclick = function(){ 
 
\t document.getElementById('textarea_1').focus(); 
 
};

<div class="modal-body"> 
 
    <div class="form-group" id="checkDiv_0"> 
 
      <div class="col-md-2 control-label"> 
 
       @Translations.ReportCopy 
 
      </div> 
 
      <div class="col-md-10"> 
 
       <div class="col-md-1"> 
 
        <button class="btn btn-primary pull-right"><span class="glyphicon glyphicon-remove"></span></button> 
 
       </div> 
 
       <div class="col-md-11"> 
 
        <textarea id="textarea_0" name="Copies" class="form-control textarea-resize"></textarea> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     <div class="form-group" id="checkDiv_1"> 
 
      <div class="col-md-2 control-label"> 
 
       @Translations.ReportCopy 
 
      </div> 
 
      <div class="col-md-10"> 
 
       <div class="col-md-1"> 
 
        <button class="btn btn-primary pull-right"><span class="glyphicon glyphicon-remove"></span></button> 
 
       </div> 
 
       <div class="col-md-11"> 
 
        <textarea id="textarea_1" name="Copies" class="form-control textarea-resize"></textarea> 
 
       </div> 
 
      </div> 
 
     </div> 
 
    <input type="button" id="focusButton" value="give element focus">

источник

2015-10-10 22:33:36 www139

* «Вы должны подождать, пока браузер завершит рендеринг». * Правда, но есть лучшие способы, чем использовать произвольный тайм-аут. Здесь перечислены: http://stackoverflow.com/q/14028959/218196 –

Вы правы. Я сделал jsfiddle в firefox. Я тестировал его сейчас в опере, и он работал без дополнительного кода. Firefox поражает или пропускает. – www139

Я переписал свой ответ, теперь он работает в любом браузере. – www139

Два примера без JQuery:

window.onload = function() { document.getElementById('textarea_1').focus(); };

или

window.addEventListener('load', function() { document.getElementById('textarea_1').focus(); }, false);

Второй позволяет назначить несколько 'onload' событий в единый элемент DOM.

источник

2015-10-10 22:41:57 Sagi

Вам нужно обернуть код JQuery внутри .ready() функции:

$(document).ready(function(){ 
    $("#textarea_1").focus(); 
});

источник

2015-10-10 22:42:45 Andrew

Вам не нужно JavaScript на этот вопрос, так как вы можете просто сделать:

<textarea id="textarea_1" name="Copies" class="form-control textarea-resize" autofocus></textarea>

Атрибут автофокусировка фокусирует текстовую область по умолчанию в DOM.

Вы можете использовать эту страницу в качестве справки:. http://www.w3schools.com/tags/att_textarea_autofocus.asp

источник

2015-10-10 22:45:56

Настройка фокуса внутри текстового поля не работает

ответ

Смежные вопросы