Обработчики событий по умолчанию

У нас есть ссылка на другой сайт, и мы хотим, чтобы при клике на нее не происходил переход, а выводился alert. Для того, чтобы отменить действие по умолчанию, используем функцию event.preventDefault();

<a href="http://google.com" onclick="func(event)">Кликайте сюда</a>

<script>

function func(event) {
    alert('Гугл не пройдет!');
    event.preventDefault();
}
</script>

Иногда используют return false, вместо preventDefault, но на самом деле это неравнозначная замена.

<a href="http://google.com" onclick="return func(event)">Кликайте сюда</a>

<script>

function func(event) {
    alert('Гугл не пройдет!');
    return false;
}
</script>

return false в функции обработчике равносильно отмене всплытия события и отмене действия по умолчанию. То есть вот такой вариант.

<a href="http://google.com" onclick="return func(event)">Кликайте сюда</a>

<script>

function func(event) {
    alert('Гугл не пройдет!');
    event.stopPropagation();
    event.preventDefault();
}
</script>

Практика:

1. Кликаем на ссылку – всплывает alert
2. Есть картинка замка и ссылка. Пока замок "закрыт" ссылка также заблокирована. При клике на замок, он открывается. После этого ссылка становится кликабельной.
3. Делаем трехстраничный сайт, на одной странице. Сажаем свои обработчики на ссылки. При клике на ссылку мы показываем пользователю соответствующую страницу
4. Скрываем стандартный <input type=”file”> и делаем автоматическую отправку формы. Подробнее это означает, что нам нужно сделать красивую кнопку, при клике на нее нужно передать этот клик на скрытый input. После того как пользователь выберет файл, должна произойти автоматическая отправка формы.
5. Есть поле для ввода текста. Под ним показывается число символов, которые пользователь может ввести. С каждым введенным символом число убывает на единицу. Добиться, чтобы после того как пользователь "потратит" все доступные символы, ввод блокировался(кроме нажатия клавиши backspace).