Interaction Helpers:

hover(over, out)

возвращает: jQuery
Симулирует hovering – отслеживание входа указателя мыши в пределы объекта и выхода за его пределы. Всякий раз, когда указатель мыши оказывается поверх объекта, вызывается функция, переданная в качестве первого аргумента. Аналогично, когда указатель мыши выходит за пределы объекта – вызывается функция, которая является вторым аргументом.

Например, чтобы добавить специальный стиль для ячейки таблицы над которой находится указатель мыши, можно сделать так:

$("td").hover(
  function () {
    $(this).addClass("hover");
  },
  function () {
    $(this).removeClass("hover");
  }
);

В следующем примере в конце каждого элемента списка добавляется три звездочки (конечно в тот момент, когда над ним находится указатель мыши).

$("li").hover(
  function () {
    $(this).append($("<span> ***</span>"));
  },
  function () {
    $(this).find("span:last").remove();
  }
);

Откройте пример в отдельном окне и посмотрите исходный код.

toggle(fn, fn1)

возвращает: jQuery
Переключается между двумя функциями, которые по очереди вызываются каждым следующим кликом. Каждый раз, когда клик совершен на выбранном элементе, срабатывает первая функция. Если на том же элементе совершен еще один клик – срабатывает вторая функция. Каждый следующий клик продолжает переключение между этими двумя функциями. Можно использовать unbind(«click»), чтобы отменить действие toggle().

Чтобы добавить специальный стиль для ячейки таблицы по которой был совершен клик, можно сделать так:

$("td").toggle(
  function () {
    $(this).addClass("selected");
  },
  function () {
    $(this).removeClass("selected");
  }
);

В следующем примере мы применяем и следующим кликом отменяем стили для каждого элемента списка.

$("li").toggle(
  function () {
    $(this).css("list-style-type", "disc")
      .css("color", "blue");
  },
  function () {
    $(this).css({"list-style-type":"", "color":""});
  }
);

Откройте пример в отдельном окне и посмотрите исходный код.

Event Helpers:

blur()

возвращает: jQuery
Вызывает событие blur для всех элементов набора. В этом случае будут вызваны все функции, связанные с этим событием blur и также вызовет действие браузера по умолчанию для этого события. Поведение браузера по умолчанию можно предупредить, возвращая false из одной или нескольких функций, связанных с этим событием blur. Событие blur обычно вызывается, когда элемент теряет фокус через действие указывающего устройства или клавиши Tab.

Вызываем событие blur для всех параграфов:

$("p").blur();

blur(fn)

возвращает: jQuery
Связывает функцию с событием blur для всех элементов набора.

Чтобы выводить в alert сообщение «Hello World!» каждый раз, когда для любого параграфа наступает событие blur, надо сделать следующее:

$("p").blur( function () { alert("Hello World!"); } );

change()

возвращает: jQuery
Вызывает событие change для каждого элемента набора. В этом случае будут вызваны все функции, связанные с этим событием change и также вызовет действие браузера по умолчанию для этого события. Поведение браузера по умолчанию можно предупредить, возвращая false из одной или нескольких функций, связанных с этим событием change. Событие change обычно вызывается, когда элемент управления теряет фокус и его значение было изменено с момента получения им фокуса.

change(fn)

возвращает: jQuery
Связывает функцию с событием change для всех элементов набора.

По событию change для всех текстовых элементов ввода вызываем некую функцию, которая например будет проверять вводимые данные.

$("input:text").change( function() {
  // здесь проверяем ввод на валидность
});

В следующем примере по событию change, используем функцию, которая получает текст каждой выбранной опции и записывает этот текст в элемент div в виде строки. Далее используем change(), чтобы вызвать это событие.

$("select").change(function () {
  var str = "";
  $("select option:selected").each(function () {
    str += $(this).text() + " ";
  });
  $("div").text(str);
}).change();

Откройте пример в отдельном окне и посмотрите исходный код.

click()

возвращает: jQuery
Вызывает событие click для каждого элемента набора. В этом случае будут вызваны все функции, связанные с этим обытием.

Чтобы вызвать событие click для всех параграфов на странице:

$("p").click();

click(fn)

возвращает: jQuery
Связывает функцию с событием click для всех элементов набора. Событие click наступает, когда кнопка указывающего устройства (например мышь) кликнута на элементе. Клик определяется как mousedown + mouseup в некотором месте экрана.

Чтобы скрыть параграфы на странице, на них необходимо кликнуть. Здесь hover() используется просто для эффекта.

$("p").click(function () {
  $(this).slideUp();
});
$("p").hover(function () {
  $(this).addClass("hilite");
}, function () {
  $(this).removeClass("hilite");
});

Откройте пример в отдельном окне и посмотрите исходный код.

dblclick()

возвращает: jQuery
Вызывает событие dblclick для каждого элемента набора. В этом случае будут вызваны все функции, связанные с этим событием dblclick и также вызовет действие браузера по умолчанию для этого события. Поведение браузера по умолчанию можно предупредить, возвращая false из одной или нескольких функций, связанных с этим событием dblclick.

dblclick(fn)

возвращает: jQuery
Связывает функцию с событием dblclick для каждого элемента набора. Событие dblclick обычно вызывается, когда кнопка указывающего устройства дважды быстро кликнута на элементе.

Чтобы выводить в alert сообщение «Hello World!» каждый раз, когда для любого параграфа наступает событие dblclick, надо сделать следующее:

$("p").dblclick( function () { alert("Hello World!"); });

В следующем примере двойной клик по элементу div, переключает его цвет.

var divdbl = $("div:first");
divdbl.dblclick(function () {
  divdbl.toggleClass('dbl');
});

Откройте пример в отдельном окне и посмотрите исходный код.

error()

возвращает: jQuery
Вызывает событие error для каждого элемента набора. В этом случае будут вызваны все функции, связанные с этим событием error и также вызовет действие браузера по умолчанию для этого события. Поведение браузера по умолчанию можно предупредить, возвращая false из одной или нескольких функций, связанных с этим событием error. Событие error обычно вызывается, когда элемент теряет фокус через действие указывающего устройства или клавиши Tab.

error(fn)

возвращает: jQuery
Связывает функцию с событием error для каждого элемента набора.
Для события error нет общих стандартов. В большинстве браузеров, событие error объекта window вызывается, когда на странице обнаружена ошибка JavaScript. Для объекта image событие error вызывается при некорректном содержимом атрибута src – например, несуществующий файл.

Если событие произошло в объекте window, обработчик события передает три параметра:

• сообщение, описывающее событие («varName is not defined», «missing operator in expression», и т.д.);
• полный URL документа, который содержит ошибку;
• номер строки, в которой произошла ошибка;

Если обработчик события вернет true, это означает, что событие было обработано и браузер не показывает никаких ошибок.

Чтобы сохранить лог ошибок JavaScript на стороне сервера, можно попробовать сделать так:

$(window).error(function(msg, url, line){
  jQuery.post("js_error_log.php",
    { msg: msg, url: url, line: line });
});

Чтобы скрыть от пользователя ошибки JavaScript, попробуйте:

$(window).error(function(){
  return true;
});

Чтобы скрыть иконку «broken image» от пользователей IE, можно попытаться сделать так:

$("img").error(function(){
  $(this).hide();
});

focus()

возвращает: jQuery
Вызывает событие focus для каждого элемента набора. В этом случае будут вызваны все функции, связанные с этим событием focus.

Чтобы при загрузке страницы сразу передать фокус элементу с идентификатором ‘login’, сделайте следующее:

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

focus(fn)

возвращает: jQuery
Связывает функцию с событием focus для каждого элемента набора. Событие focus вызывается, когда элемент получает фокус через указатель мыши или клавишу Tab.

Чтобы запретить пользователю писать что-либо в поле ввода, сделайте так:

$("input[@type=text]").focus(function(){
  $(this).blur();
});

В этом примере как только элемент input получает фокус, отображается следующий сразу за ним элемент span и в течении одной секунды «затухает».

$("input").focus(function () {
  $(this).next("span").css('display','inline')
    .fadeOut(1000);
});

Откройте пример в отдельном окне и посмотрите исходный код.

keydown()

возвращает: jQuery
Вызывает событие keydown для всех элементов набора. В этом случае будут вызваны все функции, связанные с этим событием keydown и также вызовет действие браузера по умолчанию для этого события. Поведение браузера по умолчанию можно предупредить, возвращая false из одной или нескольких функций, связанных с этим событием keydown.

keydown(fn)

возвращает: jQuery
Связывает функцию с событием keydown для каждого элемента набора. Событие keydown обычно вызывается, когда на клавиатуре нажата какая-либо клавиша.

Чтобы выполнять различные действия в зависимости от того, какая клавиша нажата на клавиатуре, попробуйте сделать так:

$(window).keydown(function(event){
  switch (event.keyCode) {
    // ...
    // разные клавиши выполняют разные сценарии
    // разные браузеры могут предоставлять разные коды
    // чтобы узнать больше смотрите тут
    // http://unixpapa.com/js/key.html
    // ...
  }
});

keypress()

возвращает: jQuery
Вызывает событие keypress для всех элементов набора. В этом случае будут вызваны все функции, связанные с этим событием keypress и также вызовет действие браузера по умолчанию для этого события. Поведение браузера по умолчанию можно предупредить, возвращая false из одной или нескольких функций, связанных с этим событием keypress. Событие keypress обычно вызывается, когда на клавиатуре была нажата какая-либо клавиша.

keypress(fn)

возвращает: jQuery
Связывает функцию с событием keypress для каждого элемента набора. Событие keypress обычно вызывается, когда на клавиатуре была нажата какая-либо клавиша. Событие keypress определяется как keydown + keyup на какой-либо клавише.

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

$("input").keypress(function (e) {
if (e.which == 32 || (65 <= e.which && e.which <= 65 + 25) || (97 <= e.which && e.which <= 97 + 25)) {
  var c = String.fromCharCode(e.which);
  $("p").append($("<span></span>")).children(":last").append(document.createTextNode(c));
} else if ( e.which == 8 ) {
  // backspace in IE only be on keydown
  $("p").children(":last").remove();
}
$("div").text(e.which);
});

Откройте пример в отдельном окне и посмотрите исходный код.

keyup()

возвращает: jQuery
Вызывает событие keyup для всех элементов набора. В этом случае будут вызваны все функции, связанные с этим событием keyup и также вызовет действие браузера по умолчанию для этого события. Поведение браузера по умолчанию можно предупредить, возвращая false из одной или нескольких функций, связанных с этим событием keyup.

keyup(fn)

возвращает: jQuery
Связывает функцию с событием keyup для каждого элемента набора. Событие keyup обычно вызывается, когда на клавиатуре была отпущена какая-либо клавиша.

Небольшой пример демонстрирует, как выполнить какое-либо действие в тот момент, когда отпущена клавиша escape:

$(document).keyup(function(event){
  if (event.keyCode == 27) {
    alert('escaped!');
  }
});

load(fn)

возвращает: jQuery
Связывает функцию с событием load для каждого элемента набора. Будучи связанным с элементом window, это событие вызывается только тогда, когда агент пользователя завершит загрузку всего содержимого документа (фреймы, объекты, графику). Для элементов это вызывается, когда целевой элемент и все его содержимое полностью загружено.
Необходимо помнить, что load будет работать только в том случае, если он определен перед элементом, полной загрузки которого мы ожидаем. Если же его определить после такого элемента – ничего не произойдет.
В этом примере некоторый код будет выполнен только после полной загрузки страницы, включая и графику.

$(window).load(function () {
  // выполняем некоторый код
});

mousedown(fn)

возвращает: jQuery
Связывает функцию с событием mousedown для каждого элемента набора. Событие mousedown обычно вызывается, когда клавиша указывающего устройства (мыши) была нажата на элементе.

В этом примере добавляется текст сообщений, когда происходят события mouseup и mousedown на элементе p.

$("p").mouseup(function(){
  $(this).append('<span style="color: #ff0000">Up!</span>');
}).mousedown(function(){
  $(this).append('<span style="color: #0000ff">Down!</span>');
});

Откройте пример в отдельном окне и посмотрите исходный код.

mousemove(fn)

возвращает: jQuery
Связывает функцию с событием mousemove для каждого элемента набора. Событие mousemove обычно вызывается, когда указатель мыши перемещается поверх элемента. Обработчик события принимает один аргумент – объект события, в свойствах clientX и clientY которого представлены координаты указателя мыши.

В этом примере показываем координаты указателя мыши в то время, как указатель перемещается над элементом div.

Примите во внимание, что здесь пример демонстрируется во фрейме, поэтому координаты курсора высчитываются относительно этого фрейма.

$("div").mousemove(function(e){
  var pCoords = "( "+e.pageX+", "+e.pageY+" )";
  var cCoords = "( "+e.clientX+", "+e.clientY+" )";
  $("span:first").text("e.pageX,e.pageY-" + pCoords);
  $("span:last").text("e.clientX,e.clientY-" + cCoords);
});

Откройте пример в отдельном окне и посмотрите исходный код.

mouseout(fn)

возвращает: jQuery
Связывает функцию с событием mouseout для каждого элемента набора. Событие mouseout обычно вызывается, когда указатель мыши выходит за пределы элемента.

В этом примере показываются сообщения, когда происходят события mouseover и mouseout. Событие mouseout вызывается, когда указатель мыши перемещается в/из дочернего элемента, тогда как для mouseleave этого не происходит.

var i = 0;
$("div.overout").mouseout(function(){
  $("p:first",this).text("мышь out");
  $("p:last",this).text(++i);
}).mouseover(function(){
  $("p:first",this).text("мышь over");
});
var n = 0;
$("div.enterleave").bind("mouseenter",function(){
  $("p:first",this).text("мышь пришла");
}).bind("mouseleave",function(){
  $("p:first",this).text("мышь ушла");
  $("p:last",this).text(++n);
});

Откройте пример в отдельном окне и посмотрите исходный код.

mouseover(fn)

возвращает: jQuery
Связывает функцию с событием mouseover для каждого элемента набора. Событие mouseover обычно вызывается, когда указатель мыши находится в пределах элемента.
В этом примере показываются сообщения, когда происходят события mouseover и mouseout. Событие mouseover вызывается, когда указатель мыши перемещается в/из дочернего элемента, тогда как для mouseleave этого не происходит.

var i = 0;
$("div.overout").mouseover(function(){
  $("p:first",this).text("мышь over");
  $("p:last",this).text(++i);
}).mouseout(function(){
  $("p:first",this).text("мышь out");
});
var n = 0;
$("div.enterleave").bind("mouseenter",function(){
  $("p:first",this).text("мышь пришла");
  $("p:last",this).text(++n);
}).bind("mouseleave",function(){
  $("p:first",this).text("мышь ушла");
});

Откройте пример в отдельном окне и посмотрите исходный код.

mouseup(fn)

возвращает: jQuery
Связывает функцию с событием mouseup для каждого элемента набора. Событие mouseup обычно вызывается, когда клавиша указывающего устройства (мыши) была отпущена на элементе.

В этом примере добавляется текст сообщений, когда происходят события mouseup и mousedown на элементе p.

$("p").mouseup(function(){
  $(this).append('<span style="color: #ff0000">Up!</span>');
}).mousedown(function(){
  $(this).append('<span style="color: #0000ff">Down!</span>');
});

Откройте пример в отдельном окне и посмотрите исходный код.

resize(fn)

возвращает: jQuery
Связывает функцию с событием resize для каждого элемента набора. Событие resize обычно вызывается, когда изменяются размеры области просмотра документа.

Чтобы сделать изменение размеров окна головной болью, попробуйте сделать так:

$(window).resize(function(){
  alert("Stop it!");
});

scroll(fn)

возвращает: jQuery
Связывает функцию с событием scroll для каждого элемента набора. Событие scroll обычно вызывается, когда прокручивается область просмотра документа.

Что бы делать что-нибудь, отслеживая прокрутку области просмотра документа:

$("p").clone().appendTo(document.body);
$("p").clone().appendTo(document.body);
$("p").clone().appendTo(document.body);
$(window).scroll(function () {
  $("span").css("display", "inline").fadeOut("slow");
});

Откройте пример в отдельном окне и посмотрите исходный код.

select()

возвращает: jQuery
Вызывает событие select для всех элементов набора. В этом случае будут вызваны все функции, связанные с этим событием select и также вызовет действие браузера по умолчанию для этого события. Поведение браузера по умолчанию можно предупредить, возвращая false из одной или нескольких функций, связанных с этим событием select.
Не стоит путать событие «select» с событием «change», которое вызывается, когда HTML-элемент select используется для выбора какой(их)-либо опций.

Чтобы вызвать событие select для всех элементов input, попробуйте сделать так:

$("input").select();

select(fn)

возвращает: jQuery
Связывает функцию с событием select для каждого элемента набора. Событие select обычно вызывается, когда пользователь выделяет какой-либо текст в текстовом поле, например input и textarea.

Чтобы выполнить какие-либо действия, когда выделяется текст в элементах ввода текста:

$(document).select( function () {
  $("div").text("Что-то было выделено!")
  .show().fadeOut(1000);
});

Откройте пример в отдельном окне и посмотрите исходный код.

submit()

возвращает: jQuery
Вызывает событие submit для всех элементов набора. В этом случае будут вызваны все функции, связанные с этим событием submit и также вызовет действие браузера по умолчанию для этого события. Поведение браузера по умолчанию можно предупредить, возвращая false из одной или нескольких функций, связанных с этим событием submit.

Чтобы вызвать событие submit для первой формы на странице, надо сделать так:

$("form:first").submit();

submit(fn)

возвращает: jQuery
Связывает функцию с событием submit для каждого элемента набора. Событие submit обычно вызывается, когда форма отправляется.

Чтобы предотвратить отправку формы, если какая-либо переменная не установлена, сделайте:

$("form").submit( function () {
  return this.some_flag_variable;
} );

Или более подробный пример на ту же тему:

$("form").submit(function() {
  if ($("input:first").val() == "correct") {
    $("span").text("Проверяем...").show();
    return true;
  }
  $("span").text("Неправильно!")
      .show().fadeOut(1000);
  return false;
});

Откройте пример в отдельном окне и посмотрите исходный код.

unload(fn)

возвращает: jQuery
Связывает функцию с событием unload для каждого элемента набора.

Чтобы попрощаться с посетителем, выведя сообщение в alert в то время когда страница закрывается:

$(window).unload( function () { alert("Bye now!"); } );

На этом пожалуй все. Ну, не совсем конечно. Впереди нас ждет еще интереснейшая тема – эффекты библиотеки jQuery.

Page Load:

ready(fn)

возвращает: jQuery
Назначает функции, которые будут выполняться всякий раз, когда объектная модель документа (DOM) готова к использованию. Это наверное самая важная функция, включенная в раздел «События», поскольку она может улучшить время реакции веб-приложений, и хорошая альтернатива использованию события window.onload, поскольку при использовании этого метода, Ваши функции будут вызваны уже в тот момент, когда объектная модель документа (DOM) готова к работе. Здесь не нужно ожидать, когда страница будет полностью загружена.

Аргумент, передаваемый обработчику события, является ссылкой на функцию jQuery. Можно использовать jQuery или $ без риска возникновения коллизий в пространстве имен. Однако необходимо убедиться в том, что не имеет обработчика события onload, в противном случае $(document).ready() может не выполниться.

На странице можно иметь сколь угодно много $(document).ready событий. В этом случае функции, связанные с ними, будут выполняться в порядке их следования.

В этом примере мы покажем сообщение о том, что DOM загружена и готова к работе.

$(document).ready(function(){
  $("p:first")
    .text("DOM загружена и готова к работе!");
});
// еще раз тоже самое
jQuery(document).ready(function(){
  jQuery("p:last")
    .text("Объектная модель документа готова!");
});

Откройте пример в отдельном окне и посмотрите исходный код.

Event Handling:

bind(type, [data], fn)

возвращает: jQuery
Связывает обработчик с одним или более событиями (например click) для каждого элемента набора. Может также связывать пользовательские события. Возможные события: blur, focus, load, resize, scroll, unload, click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter, mouseleave, change, select, submit, keydown, keypress, keyup, error. Обработчик события принимает объект событие, что делает возможным предотвращение поведения по умолчанию. Чтобы предотвратить и поведение по умолчанию и «всплывание» события (т.е. передачу события от одного элемента другому), обработчик должен возвращать false.

В большинстве случаев можно определить обработчики события как анонимные функции, как показано в следующем примере. Всякий раз, когда совершен клик на параграфе, в alert выводится текст этого параграфа.

$("p").bind("click", function(){
  alert( $(this).text() );
});

В случае, если это невозможно, следует передавать дополнительные данные во втором параметре [data] (см. пример).

function handler(event) {
  alert(event.data.foo);
}
$("p").bind("click", {foo: "bar"}, handler);

Чтобы отменить действие по умолчанию и предотвратить «всплывание», возвращаем false:

$("form").bind("submit", function() { return false; });

Чтобы отменить только действие по умолчанию используется метод preventDefault.

$("form").bind("submit", function(event){
  event.preventDefault();
});

Для предотвращения «всплывания» события используется метод stopPropagation.

$("form").bind("submit", function(event){
  event.stopPropagation();
});

Также можно связать некие пользовательские события.

$("p").bind("myCustomEvent", function(e,myName,myValue){
  $(this).text(myName + ", hi there!");
  $("span").stop().css("opacity", 1)
    .text("myName = " + myName)
    .fadeIn(30).fadeOut(1000);
});
$("button").click(function () {
  $("p").trigger("myCustomEvent", [ "John" ]);
});

Откройте пример в отдельном окне и посмотрите исходный код.

В следующем примере демонстрируется обработка событий click и double-click на параграфе.

$("p").bind("click", function(e){
  var str = "( " + e.pageX + ", " + e.pageY + " )";
  $("span").text("Кликнуто! " + str);
});
$("p").bind("dblclick", function(){
  $("span").text("Двойной клик сделан на "+this.tagName);
});
$("p").bind("mouseenter mouseleave", function(e){
  $(this).toggleClass("over");
});

Откройте пример в отдельном окне и посмотрите исходный код.

Примите во внимание, что пример демонстрируется во фрейме, соответственно и координаты вычисляются относительно фрейма.

one(type, [data], fn)

возвращает: jQuery
Связывает обработчик с одним или более событиями, которые будут выполнены только один раз, для каждого элемента в наборе. Обработчик исполняется только один раз для каждого элемента. В остальном действуют те же правила, описанные при применении bind(). Обработчик события принимает объект событие, что делает возможным предотвращение поведения по умолчанию. Чтобы предотвратить и поведение по умолчанию и «всплывание» события (т.е. передачу события от одного элемента другому), обработчик должен возвращать false.

В большинстве случаев можно определить обработчики события как анонимные функции, как показано в следующем примере. Первый клик, который совершен на параграфе, выводит в alert текст этого параграфа.

$("p").one("click", function(){
  alert( $(this).text() );
});

В случае, если это невозможно, следует передавать дополнительные данные во втором параметре [data]. В следующем примере связываем «одноразовый» клик с каждым элементом div.

var n = 0;
$("div").one("click", function(){
  var index = $("div").index(this);
  $(this).css({ borderStyle:"inset", cursor:"auto" });
  $("p").text("DIV с индексом #" + index + " кликнут." +
  "  Всего " + ++n + " кликов.");
});

Откройте пример в отдельном окне и посмотрите исходный код.

trigger(type, [data])

возвращает: jQuery
Вызывает событие (переданное в type) для каждого элемента набора. Однако это также вызовет выполнение браузером действий по умолчанию для этого события. Например, передавая ’submit’ в функцию trigger() Вы заставите браузер отправить форму. Действия браузера по умолчанию можно предотвратить, возвращая false для одной из функций, связанных с событием.

Чтобы отправить первую форму без использования submit(), надо проделать следующее:

$("form:first").trigger("submit");

Чтобы передать произвольные данные событию:

$("p").click( function (event, a, b) {
  // при обычном клике по параграфу,
  // a и b остаются неопределенными
  // при клике вызванном через trigger(),
  // a ссылается на "foo", b ссылается на "bar".
} ).trigger("click", ["foo", "bar"]);

В этом примере будет яснее. Следующий код выводит «Hello World!» в alert.

$("p").bind("myEvent", function (event,mess1,mess2) {
  alert(mess1 + ' ' + mess2);
});
$("p").trigger("myEvent", ["Hello","World!"]);

Также можно вызывать пользовательские события, зарегистрированные в bind. В этом примере клик по button #2 вызывает клик по button #1. Но не наоборот.

$("button:first").click(function () {
  update($("span:first"));
});
$("button:last").click(function () {
  $("button:first").trigger('click');
  update($("span:last"));
});
function update(j) {
  var n = parseInt(j.text(), 0);
  j.text(n + 1);
}

Откройте пример в отдельном окне и посмотрите исходный код.

triggerHandler(type, [data])

возвращает: jQuery
Это особенный метод вызова всех связанных с элементом обработчиков событий БЕЗ выполнения браузером действий по умолчанию. Событие вызывается только для первого элемента, включенного в набор. Если набор элементов пуст, этот метод вернет ‘undefined’.

Испытайте следующий пример. Если Вы вызываете trigger(), то получаете соответствующее сообщение и можете заметить как браузер ТОЖЕ совершил действие по умолчанию – передал фокус элементу input. Попробуйте теперь (убрав фокус с элемента input) вызвать triggerHandler() – сообщение Вы также получите, но действия браузера по умолчанию не произойдет.

$("#old").click(function(){
  $("input").trigger("focus");
});
$("#new").click(function(){
  $("input").triggerHandler("focus");
});
$("input").focus(function(){
  $("<span>Focused!</span>").appendTo("body")
    .fadeOut(1000);
});

Откройте пример в отдельном окне и посмотрите исходный код.

unbind([type], [data])

возвращает: jQuery
Это метод – противоположность bind, он удаляет все события связанные с элементом для каждого элемента набора. Можно также удалить пользовательские события, зарегистрированные в bind(). Если передан аргумент type – удалены будут все события этого типа.

Посмотрите внимательнее следующий пример. Нажатие на кнопку Bind, делает цветную кнопку «рабочей». Если же нажать кнопку Unbind, цветная кнопка больше не работает…

function aClick() {
  $("div").show().fadeOut("slow");
}
$("#bind").click(function () {
  $("#theone").click(aClick).text("Can Click!");
});
$("#unbind").click(function () {
  $("#theone").unbind('click', aClick)
    .text("Does nothing...");
});

Откройте пример в отдельном окне и посмотрите исходный код.

Ну, для первой части достаточно, а во второй, как и обещал, будем знакомиться с хэлперами…