JavaScript. Подробное руководство, 6-е издание - [9]
1.2.1. Пример: калькулятор платежей по ссуде на JavaScript
Эта глава завершается расширенным примером, объединяющим в себе многие из описанных выше приемов и демонстрирующим полноценную программу на клиентском JavaScript (плюс HTML и CSS). В примере 1.1 представлена реализация простого калькулятора для вычисления платежей по ссуде (рис. 1.2).
Стоит потратить время на внимательное рассмотрение примера 1.1. Вряд ли вы сумеете досконально разобраться в нем, однако благодаря подробным комментариям вы должны по крайней мере получить общее представление о том, как действует это веб-приложение. Пример демонстрирует множество особенностей базового языка JavaScript, а также некоторые важные приемы программирования на клиентском JavaScript:
• Поиск элементов в документе.
• Получение ввода пользователя с помощью элементов форм.
• Изменение содержимого элементов документа.
• Сохранение данных в броузере.
• Управление НТТР-запросами.
• Создание графики с помощью элемента
Пример 1.1. Калькулятор вычисления платежей по ссуде на JavaScript
>
>
>
>
>
>
>
>
>Это HTML-таблица с элементами , позволяющими вводить данные, и с элементами ,
> в которых отображаются результаты вычислений. Эти элементы имеют идентификаторы,
>такие как "interest" и "years". Данные идентификаторы используются в JavaScript-коде,
>который следует за определением таблицы. Обратите внимание, что для некоторых
>элементов ввода определены обработчики событий "onchange" и "onclick".
>В них заданы строки JavaScript-кода, выполняемого при вводе данных или щелчке на кнопке.
>-->
>> > Enter Loan Data: > > Loan Balance, Cumulative Equity, and Interest Payments > > > Amount of the loan ($): > > > > > > > Annual interest (%): > > > > Repayment period (years): > > > > Zipcode (to find lenders): > >> > Approximate Payments: > > > > Monthly payment: > $ > > > Total payment:c/td> > $ > > > Total interest:c/td> > $ > > > Sponsors:c/th> > > Apply for your loan with one of these fine lenders:> > > >
>
>
>
>