Главная
Простейшие операторы
Операторы условия
Циклы
Массивы
Массивы II
Строки
Функции I
Функции II

Что такое функция

 Функция представляет собой очень мощный инструмент для организации программы. Если до сих пор программа начинала у нас работать сразу после открытия документа, то сегодня мы разберемся, как этого избежать.
Для начала разберемся, как происходит вызов функции. В следующей программе мы всего лишь выведем на экран сообщение с помощью функции:
<script>
function alerting() {
alert("Выводим сообщение");
}
alerting();
</script>
 С помощью строки function alerting() мы создали функцию alerting(). А с помощью строки alerting() мы вызвали эту самую функцию. Блок function functionname() { } может находится в любой части программы. Проку от той функции, которую создали мы, немного, поэтому мы разберем сначала события.

События

 С помощью событий можно более удобно управлять программой. Рассмотрим некоторые события:
  • onload - это событие происходит, как только веб-страница полностью загружается. В следующей программе JScript сообщит пользователю, когда закончится загрузка страницы:
    • <script>
    function ura() {
    alert("Веб-страница загрузилась на 100%");
    }
    </script>
    <body onLoad="ura()">
    </body>
  • onunload - это событие произойдет, когда пользователь закроет веб-страницу:
    • <script>
    function goodbye() {
    alert("Пока! Надеюсь, еще увидемся!");
    }
    </script>
    <body onunload="goodbye()">
    </body>
  • onstop - это событие произойдет, если пользователь остановит загрузку веб-страницы: нажмет кнопку "Стоп", перейдет по ссылке или закроет страницу до полной ее загрузки:
    • <script>
    function ey() {
    alert("Эй! Страница еще загрузиться не успела!");
    }
    </script>
    <body onstop="ey()">
    </body>
  • onMouseOver - происходит при наведении указателя на определенный объект:
    • <script>
    function haha() {
    alert("Ты только что подвел или подвела мышку к ЗАПРЕТНОЙ ЗОНЕ!!!");
    }
    </script>
    <body>

    <p onmouseover="haha()">Это - <b>ЗАПРЕТНАЯ ЗОНА</b>! Не подводи сюда мышку!</p>

    </body>
  • onMouseOut - наоборот, происходит, когда мышку уводят от какого-то элемента:
    • <script>
    function mistake() {
    alert("Ты куда мышку дел?!");
    }
    </script>
    <body onmouseout="mistake()">
    </body>
  • onMouseMove() - происходит при перемещении мышки. Наиболее частый пример - отображение в строке состояния текущих координат курсора:
    • <script>
    function coord() {
    window.status="x="+event.x+"; y="+event.y;
    }
    </script>
    <body>
    <p onmousemove="coord()" onmouseout="window.status=''">Узнайте текущие координаты курсора</p>
    </body>
  • onClick - происходит при нажатии главной кнопки мыши (левой для правши, правой для левши):
    • <script>
    function clicks() {
    alert("Вы думали это ссылка?")
    }
    </script>
    <a href="#" onclick="clicks()">Ссылка</a>


    onDblClick - происходит при двойном щелчке:
    <script>
    function clicks() {
    alert("Зачем в Интернете щелкать два раза?!");
    }
    </script>
    <body ondblclick="clicks()">
    </body>
  • onContextMenu - происходит при вызове контекстного меню. Один из самых ненадежных способов защиты информации - отключение контекстного меню:
    • <script>
    function context() {
    event.returnValue=false;
    }
    </script>
    <body oncontextmenu="context()">
    </body>
  • onHelp - происходит при вызове меню помощи. Удобно применять для организации своего Help'a:
    • <script>
    function helper() {
    alert('На нашем сайте все просто - ходите по ссылкам и не задумывайтесь');
    event.returnValue=false;
    }
    </script>
    <body onhelp="helper()">
    </body>
  • Оставшиеся события говорят сами за себя: onMouseUp; onKeyPress; onKeyDown; onKeyUp.
    • Упражнение 33
    Создать программу, которая позволит перевести температуру по Цельсию в температуру по Фаренгейту и наоборот. Вспомним, что 1°C = (1°F−32)/1,8; 1°F = 1,8°C+32. Создадим две функции и HTML-код:
    <html>
    <head>
    <script>
    function CtoF() {
    c=prompt("Введите температуру", "");
    c=Number(c);
    f=1.8*c+32;
    alert(c+"\xB0C="+f+"\xB0F");
    }

    function FtoC() {
    f=prompt("Введите температуру", "");
    f=Number(f);
    c=(f-32)/1.8;
    alert(f+"\xB0F="+c+"\xB0C");
    }
    </script>
    </head>
    <body>
    <button onclick="CtoF()">От &deg;C к &deg;F</button>
    <button onclick="FtoC()">От &deg;F к &deg;C</button>
    </body>
    </html>


     Важно также сохранять результаты функции. Для этого есть специальный оператор return(). В его скобках указываются переменные, которые следует передать всей программе. Что это означает: допустим, в ходе выполнения какой-то функции появилось значение для переменной x=5. Если потом в программе (не в этой функции) попытаться повысить значение x на 1: x+=1, то возникнет ошибка, ибо программа не знает никакую переменную x.

    Другое дело, если в функции написать: x=5; return(x) - тогда у всей программы появится новая переменная - x.

    [В начало]
    Hosted by uCoz