jQuery: Функции управляющие элементом

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

Функция при клике на элемент

Code

$('div:first').click(function(){
alert('Ты нажал на div!');
});

При клике на первый на странице div появится алерт с выше указанным текстом. Очень простая работа.

Заметьте что мы указали click(function, что однозначно показывает что функция должна происходить именно при клике. Вы, конечно, можете заставить выполняться функцию и при наведении/фокусе и прочем прочем.
Собственно вот:
ready - функция происходящая при полной загрузке элемента *;
click - функция происходящая при клике;
dblclick - функция происходящая при двойном клике;
error - функция происходящая при js-ошибке;
keyup - функция происходящая когда отпущена клавиша;
keypress - функция происходящая когда нажата клавиша;
load - функция происходящая при загрузке;
hover - функция происходящая при наведении мышкой;
focus - функция происходящая при фокусе (при попадании курсора в поле ввода текста);
blur - функция происходящая при потере фокуса (вытащили курсор из под поля ввода текста);
* для функции, происходящей после загрузки страницы необходимо document.ready(function
без указания $(div:first).
Вообще их много. Подробнее описано на jQuery Api.

Небольшая скрывалка элементов

Code

<div><a href="javascript://">Скрыть зеленый</a><a href="javascript://">Скрыть красный</a></div>
<div style="background:green">Зеленый</div><div style="background:red">Красный</div>

Code

$('div > a:first').click(function(){
$('div[style="background:green"]').hide();
return false;
});
$('div > a:last').click(function(){
$('div[style="background:red"]').hide();
return false;
});

Запрещаем нажимать на некоторые ссылки
Вот к примеру запретим нажимать на ссылки, ведущие на www.superpuperporno.ru.
Допустим затронуть саму ссылку мы не сможем, пойдем другим путем:

Code

$('a[href="http://www.superpuperporno.ru/"]').click(function(){
return false;
});

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

Code

$('a[href="http://www.superpuperporno.ru/"]').click(function(){
alert('Ах ты дрочер! Тебе так хочется посмотреть порнуху?');
return false;
});

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

Code

$('a[href*="/index/8-"]').click(function(){
new _uWnd('AjaxuProfile','Профиль',500,400,{autosize:1},{url:this.href});
return false;
});

Подтверждение о выходе с сайта

Code

$('a[href="/index/10"]').click(function(){
return confirm('Вы уверены что хотите выйти?');
};
});

Кстати, ни один вариант я не пробовал и 100% работоспособность не гарантирую.
Может будет продолжение статьи.

Комментарии

Оставьте комментарий

Категории

Так

Друзья

Форма входа

Мини чат

Рекламный блок

Рекламный блок

Рекламный блок