Last active
August 26, 2019 09:45
-
-
Save rediffusion/5555260cf227124c57cdb0ff22242bed to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(document).ready(function() { | |
// ### Формы (focus, change и т.д.) | |
// input - текстовое поле для ввода; focus - то есть поместили курсор в область этого поля. | |
$('input').focus(function() { | |
// Ещё можно присваивать какие то классы, значения, менять стиль элементов но в качестве примера выберем - console. | |
console.log("Поле в фокусе"); | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(document).ready(function() { | |
// ### Формы (focus, change и т.д.) | |
// change - если изменяем что то в этом поле. Пользователь ввел своё имя и поле потеряло статус focus | |
$('input').change(function() { | |
// <form action="#"> | |
// <input type="text" placeholder="Введи своё имя"> | |
// <p>Приветствую тебя<span id="userName"></span>!</p> | |
// </form> | |
$("#userName").text(", " + $(this).val()); // В итоге получим "Приветствую тебя, Артём !" | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(document).ready(function() { | |
// ### Клавиатура (keypress, keydown, keyup) | |
// keypress или keydown - будет считывать нажатие клавиш (при нажатии). | |
// keyup - будет считывать нажатие клавиш (при отпускании, то есть последняя буква будет считана тоже). | |
$("input").keyup(function() { | |
$("#userName").text(", " + $(this).val()); | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(document).ready(function () { | |
// ### Клики мышью (click, dbclick) | |
$('h2').click(function () { | |
// Способ 1: | |
alert('Ты кликнул по заголовку') | |
// Способ 2: | |
// В браузере ·· RightClickMenu>Просмотреть код>Console | |
console.log('Ты кликнул по заголовку') | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(document).ready(function () { | |
// ### Клики мышью (click, dbclick) | |
// Двойной клик и заголовок станет синий. | |
$('h2').dblclick(function () { | |
$(this).toggleClass("blue"); | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(document).ready(function() { | |
// ### Полёты над элементом (mouseenter, mouseleave и т.д.) | |
// Можем отловить событие, которое будет окрашивать элемент в синий цвет при наведении курсора: | |
$('h2').mouseenter(function() { | |
$(this).toggleClass("blue"); | |
}); | |
// Если добавить mouseleave - то цвет будет меняться на свой. | |
$('h2').mouseenter(function() { | |
$(this).toggleClass("blue"); | |
}); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment