jQuery метод .select()

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

jQuery метод .select() привязывает JavaScript обработчик событий "select" (срабатывает при выделении текста), или запускает это событие на выбранный элемент. Метод используется с элементом <input> (с текстовым типом type = "text") и элементом <textarea>.

jQuery синтаксис:

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

$( selector ).select( handler ) 

handler - Function( Event eventObject )

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

eventData - Anything
handler - Function( Event eventObject )

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

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

$( selector ).trigger( "select" )

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

1.0 (синтаксис обновлен в версии 1.4.3)

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

Параметр	Описание
eventData	Объект, содержащий данные, которые будут переданы в обработчик событий.
handler	Функция, которая будет выполнена каждый раз, когда событие срабатывает. Функция в качестве параметра может принимать объект Event.

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

<!DOCTYPE html>
<html>
	<head>
		<title>Использование jQuery метода .select() (без параметров и с функцией)</title>
		<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
		<script>
	$( document ).ready(function(){
	  $( "button" ).click(function(){ // задаем функцию при нажатиии на элемент <button>
	    $( "input" ).select(); // вызываем событие select на элементе <input>
	  });
	  var num = 0; // создаем переменную (счетчик) 
	  $( "input, textarea" ).select(function(){ // задаем функцию при срабатывании события select на элементе  <input>, или <textarea> 
	    num++; // инкремент 	   
	    $( "p" ).text( "Текст выделен: " + num + " раз" ); // добавляем в элемент <p> информацию о количестве срабатываний события select
	  });
	});
		</script>
	</head>
	<body>
		<button>Клик</button>
		<input value = "Выдели меня"><br>
		<textarea>Выдели меня</textarea>
		<p></p>
	</body>
</html>

В этом примере с использованием jQuery метода .select() мы при нажатии на элемент <button> (кнопка) вызываем событие "select" на элементе <input>. Если вызвать событие на элементе <textarea> эффект будет тот же, так как у нас задействован групповой селектор.

Элементам <input> и <textarea> задали, что при срабатывании события "select" выполнить функцию, которая с использованием метода .text() добавляет текстовое содержимое со значением переменной, которая содержит количество срабатывания события "select".

Обратите внимание на то, что метод .select(), вызванный без параметров может вызывать событие "select" многократно в браузере Chrome, увеличивая счетчик не на один, а на два, а то и на три.

Результат нашего примера:

Пример использования jQuery метода .select() (без параметров и с функцией). — Пример использования jQuery метода .select() (без параметров и с функцией)

jQuery события