jQuery функция .change()

Раздел: Работа с формой

Описание: Привязвает обработчик события change JavaScript или запускает это событие на элемент.

Событие change посылается элементу, когда его значение меняется.

.change() ограниченно для элементов input, textarea и select

Для полей выбора, флажков, радио-кнопок, это событие запускается сразу, когда пользователь делает выбор, а для других типов элементов событие на элемент запускается когда элемент теряет фокус.

Пример №1

Обработать событие change

html:
<select size="8" id="sweets" multiple="multiple">
 <option>Шоколад</option>
 <option>Конфеты</option>
 <option>Тэффи</option>
 <option>Карамельный</option>
 <option>Фадж</option>
 <option>Печенье</option>
</select>
 <div></div>
javascript:
$("select").change(function () {
 var str = "";
 $("select option:selected").each(function () {
 str += $(this).text() + " ";
 });
 $("div").text(str);
 })
 .change();

Выберите значения

Пример №2

Устаноыить событие change

javascript:
 $('select').change();

Полный пример

html:
<!doctype html>
<html lang="en">
<head>
 <meta charset="utf-8">
 <title>change demo</title>
 <style>
 div {
 color: red;
 }
 </style>
 <script src="https://code.jquery.com/jquery-1.10.2.js"></script >
</head>
<body>
<select name="sweets" multiple="multiple">
 <option>Chocolate</option>
 <option selected="selected">Candy</option>
 <option>Taffy</option>
 <option selected="selected">Caramel</option>
 <option>Fudge</option>
 <option>Cookie</option>
</select>
<div></div>
<script>
$( "select" )
 .change(function () {
 var str = "";
 $( "select option:selected" ).each(function() {
 str += $( this ).text() + " ";
 });
 $( "div" ).text( str );
 })
 .change();
</script >
</body>
</html>