jQuery метод .blur()

Определение и применение

jQuery метод .blur() привязывает JavaScript обработчик событий "blur" (потеря фокуса элементом), или запускает это событие на выбранный элемент.

jQuery синтаксис:

Синтаксис 1.0:
$( selector ).blur() // метод используется без параметров

$( selector ).blur( handler ) 

handler - Function( Event eventObject )

Синтаксис 1.4.3:
$( selector ).blur( eventData, handler ) 

eventData - Anything
handler - Function( Event eventObject )

Обращаю Ваше внимание, что метод .blur(), используемый вместе с функцией, переданной в качестве параметра (handler) является, короткой записью метода .on(), а без параметра является короткой записью метода .trigger():

$( selector ).on( "blur", handler ) 

$( selector ).trigger( "blur" ) 

Добавлен в версии jQuery

Значения параметров

Пример использования

<button>Клик</button><br />
<input />

$(document).ready(function () {
    $('button').click(function () {
        $('input').blur()
    })
    $('input').focus(function () {
        $('input').attr('placeholder', 'focus')
    })
    $('input').blur(function () {
        $('input').attr('placeholder', 'blur')
    })
})

В этом примере с использованием jQuery метода .blur() мы при нажатии на элемент <button> (кнопка) вызываем событие "blur" на элементе <input>. Самому элементу <input> задаем, что при срабатывании события "blur" на элементе выполнить функцию, которая с использованием метода .attr() добавляет атрибут placeholder со значением blur.

Кроме того, мы с использованием jQuery метода .focus() устанавливаем, что при получении фокуса элементом <input> вызвать функцию, которая с использованием метода .attr() добавляет атрибут placeholder со значением focus.

Рассмотрим следующий пример, в котором мы используем jQuery метод .blur() с двумя параметрами:

<input />
<span></span>

$(document).ready(function () {
    var eventData = { myData: 'information here' }
    $('input').blur(eventData, function (event) {
        $('span').text('eventData: ' + event.data.myData)
    })
})

В этом примере с использованием jQuery метода .blur() мы при при потере фокуса элементом <input> задаем функцию, которая передает данные в объект события Event (значение созданной переменной) и методом .text() выводим в элементе <span> эти данные с использованием свойства data объекта Event.