www.jQueryBook.ru - jQuery документация

 

Сегодня: 06 декабря 2016 года, Вторник
Раздел API на стадии наполнения...

 

 

 

  • Категории: EventsForm EventsForms

    .focus()

    Устанавливает (или вызывает) обработчики JavaScript события focus (когда элемент получает фокус ввода) для всех элементов набора jQuery.

Синтаксис и описание:

  • Добавлено в jQuery 1.0.focus( [handler( eventObject )] )

  • Устанавливает функцию handler() как обработчик JavaScript события focus (когда элемент получает фокус ввода) для всех элементов набора jQuery. Это сокращенный форма функции .bind() :

    .bind('focus', handler)

    Без параметра handler() запускает все обработчики JavaScript события focus, установленные во всех соответствующих элементах, и, имитируя событие focus, искусственно передает фокус соответствующим элементам набора jQuery (от первого к последнему), а обработчики получают искусственно созданный объект события Event. Это короткий вариант метода .trigger() :

    .trigger('focus')

Возвращаемое значение: (объект) Набор jQuery.

Параметры:

  • handler( [eventObject] ) – Необязательный параметр - функция, назначаемая обработчиком JS события focus. Получает единственный аргумент eventObject (экземпляр объекта Event). Ключевое слово this внутри функции (контекст функции) ссылается на текущий элемент набора jQuery.


              function handler(eventObject) {
                  this; // текущий DOM-элемент.
                }
  1. Примечание:

    Актуально для <button>, <input>, <label>, <select>, <textarea>, <body>, а также ссылок <a>.

  2. Примечание:

    Команда .focus() без параметров в разных браузерах работает не одинаково. Например, в первом примере при щелчке на элементе P в браузере Internet Explorer обработчик запустится 2 раза (сразу и когда элемент получит фокус).

    Чтобы предотвратить второе срабатывание обработчика для IE, во втором примере отменим поведение браузера по умолчанию вызвав метод event.preventDefault() из обработчика, чем добьемся кроссбраузерности, но элемент не получит фокус ввода.

    Фокус ввода, кстати, можно передать и не устанавливая предварительно обработчик события focus (как показано в Примере 3).


Примеры:

  1. Установить обработчик события focus для всех элементов <input>. При клике на параграфе <p> вызвать обработчик для первого из них.

    <p>Передать фокус первому элементу input.</p>
    <input id="targ1" /> <input id="targ2" /> 
    
    <script type="text/javascript">
      $('input').focus(function(event) {
         alert(event.target.tagName + '#' + event.target.id);
        });
      $('p').click(function() {
         $('#targ1').focus();
        });
    </script>


    Демонстрация примера:







  2. Установить обработчик события focus для всех элементов <input>. При клике на параграфе <p> вызвать обработчик для первого из них.

    <p>Запустить обработчик события focus для первого элемента input.</p>
    <input id="targ1" /> <input id="targ2" /> 
    
    <script type="text/javascript">
      $('input').focus(function(event) {
         alert(event.target.tagName + '#' + event.target.id);
         event.preventDefault();
        });
      $('p').click(function() {
         $('#targ1').focus();
        });
    </script>


    Демонстрация примера:







  3. Передать фокус элементу input с id="targ1".

    <p>Передать фокус первому элементу input.</p>
    <input id="targ1" /> <input id="targ2" /> 
    
    <script type="text/javascript">
      $('p').click(function() {
         $('#targ1').focus();
        });
    </script>


    Демонстрация примера:



[ наверх ]










 




Справочник по jQuery JavaScript API на русском языке