Читайте также:
|
Клавиатура. keydown(),.keypress(),.keyup()
Мышь. click(),.dblclick(),.hover()
Браузер. resize(),.scroll()
Элементы формы. blur(),.change(),.focus(),.select(),.submit()
Пример1. Выключение заголовка h1 внутри блока с id=header (привязка выполнена к элементу с id="header_off")
$('#header_off').click(function() {
$('#header h1').hide();
});
$('#header_off').on('click', function() {
$('#header h1').hide();
});
Пример2 Замена фона при нахождении указателя над элементом
$('div').hover(
function() { // mouseenter()
$(this).css('background', '#fc0');
},
function() { // mouseleave()
$(this).css('background', '#fff');
}
);
Пример 3,4 Получение кода нажатой клавиши внутри текстового поля
$('input[type=text]').keydown(
function(e) {
console.log(e.keyCode);
});
Ограничение ввода внутри текстового поля
$('input[type=text]').keydown(
function(e) {
if (e.keyCode < 48 || e.keyCode > 57) {
console.log(e.keyCode);
e.preventDefault(); }
});
Пример 5 Получение размеров окна браузера
$(window).resize(function() {
console.log("Ширина окна: " + $(this).width() + " Высота окна: " + $(this).height());
});
Пример 6 Предварительная обработка данных формы
$("form").submit(function(event) {
if ($("input:first").val() == "correct") {
$("span").text("Valid").show();
return;
}
$("span").text("Not valid!").show().hide(1000);
event.preventDefault();
});
Событие можно вызвать "вручную", используя метод trigger().
Пример 1.
$('#header_off').click(function() {
$('#header h1').hide();
});
$('#header_off').trigger("click");
Можно создать свое событие и генерировать его в нужных случаях, одновременно передавая параметры.
Пример 2.
$("#test").on("myEvent", function(event, param1, param2)
{
console.log(param1 + ", " + param2);
});
$("#test").trigger("myEvent", [ "One", "Two" ]);
43. jQuery. Последовательные вызовы и callback-функции.
jQuery – фреймворк, предназначенный для упрощения работы с Javascript. jQuery представляет собой специальную библиотеку javascript-функций, предназначенных для выполнения различных задач на стороне клиента.
Сайт: jquery.com
Последовательность вызова:
Методы в jQuery возвращают ссылку на результат своей работы, что позволят ‘сцеплять’ эти методы.
Пример 1 $("a").addClass("test").html("Текст");
Иногда нужно остановить проход по цепочке и вернуться на верхний уровень. Для этого используется метод end().
Пример 2
<p><span>Привет!</span> Это я!</p>
$("p")
.find("span")
.css("border", "2px green solid")
.end()
.css("border", "2px red solid");
Дата добавления: 2015-02-16; просмотров: 121 | Поможем написать вашу работу | Нарушение авторских прав |