| | | | | |
Onclick в javascript примеры
На onclick можно повесить вообще любое событие, какое только можно придумать! В качестве примера рекомендую - как сделать
калькулятор - все события производится именно кнопками, на которых повешено событие onclick.
И самое первое с чего надо начать это:
Синтаксис:
onclick="скрипт"
А уж в скрипт можно поместить все, что угодно! Т.е. при клике будет выполняться кое-то действие.
Примеры работы onclick.
1.
Ну посмотрим самый простой пример работы onclick
<div onclick="alert(' Щелчок мыши!')"> Щелкните мышью на тексте</div>
Нажмите на текст...
Щелкните мышью на тексте
2.
Второй пример onclick.
Ну что.. давайте провесим на onclick, какое-то действие, самое простое - показать время.
<button onclick="getElementById('demo').innerHTML = Date()">Сколько времни!?</button>
<kod id="demo"></kod>
Нажмите по кнопке...
Как сделать в onclick два события!?
3.
Не буду выделять в отдельную страницу…
Нередко встречаются такие ситуации, что на onclick требуется повесить больше одного события, например два события в onclick или по-другому две функции при одном нажатии будет выполняться два и больше событий, столько, сколько выв вообще захотите.
Пример два события по одному нажатию на кнопку – давайте соединим два верхних примера в одно нажатие onclick
<button onclick="getElementById('demo').innerHTML = Date();alert('Щелчок мыши!')">Два события.</button>
<kod id="demo"></kod>
4.
Изменить цвет текста onclick!?
Если , например нужно изменить где-то цвет, то можно посмотреть пример с помощью onclick
Код:
<button onclick="getElementById('rezult').setAttribute('style', 'color: red;');">Изменить цвет</button>
<div id="rezult">Здесь текст, который будет менять при нажатии</div>
Результат:
Здесь текст, который будет менять при нажатии
5.
onclick и функция!?
Например, когда надо много событий навесить в onclick, то можно навесить на onclick только функцию, а в функции написать функцию, которая и будет выполнять все, что нужно при нажатии на кнопку...
Далее изменение текста и одновременное изменение цвета.
Код:
<<button onclick="foo()">Нажми здесь</button>
далее скрипт, либо можно выделить в отдельный файл скрипта...
<script> function foo() {
document.getElementById("rezult_1").innerHTML = "привет";
document.getElementById("rezult_1").setAttribute("style", "color: red" );
}
</script>
Результат:
Здесь текст, который будет менять при нажатии
С вашими куками, что-то не то..., попробуете перезагрузить страницу..