JavaScript. Подробное руководство, 6-е издание - [10]

  // указал корректные данные и результаты можно отобразить
  if (isFinite(monthly)) {
    // Заполнить поля вывода, округлив результаты до 2 десятичных знаков
    payment.innerHTML = monthly.toFixed(2);
    total.innerHTML = (monthly * payments).toFixed(2);
    totalinterest.innerHTML = ((monthly*payments)-principal).toFixed(2);

    // Сохранить ввод пользователя, чтобы можно было восстановить данные
    // при следующем открытии страницы
    save(amount.value, apr.value, years.value, zipcode.value);
    // Реклама: отыскать и отобразить ссылки на сайты местных
    // кредитных учреждений, но игнорировать сетевые ошибки
    try { // Перехватывать все ошибки, возникающие в этих фигурных скобках
      getLenders(amount.value, apr.value, years.value, zipcode.value);
    }
    catch(e) { /* И игнорировать эти ошибки */ }

    // В заключение вывести график изменения остатка по кредиту, а также
    // графики сумм, выплачиваемых в погашение кредита и по процентам
    chart(principal, interest, monthly, payments);
  }
  else {
    // Результат не является числом или имеет бесконечное значение,
    // что означает, что были получены неполные или некорректные данные.
    // Очистить все результаты, выведенные ранее,
    payment.innerHTML = "";
    // Стереть содержимое этих элементов total.innerHTML = totalinterest.innerHTML = "";
    chart(); // При вызове без аргументов очищает диаграмму
  }
}

// Сохранить ввод пользователя в свойствах объекта localStorage. Значения этих свойств
// будут доступны при повторном посещении страницы. В некоторых броузерах (например.
// в Firefox) возможность сохранения не поддерживается, если страница открывается
// с адресом URL вида file://. Однако она поддерживается при открытии страницы через HTTP.
function save(amount, apr, years, zipcode) {
  if (window.localStorage) { // Выполнить сохранение, если поддерживается
    localStorage.loan_amount = amount;
    localStorage.loan_apr = apr;
    localStorage.loan_years = years;
    localStorage.loan_zipcode = zipcode;
  }
}

// Автоматически восстановить поля ввода при загрузке документа,
window.onload = function() {
  // Если броузер поддерживает localStorage и имеются сохраненные данные
  if (window.localStorage && localStorage.loan_amount) {
    document.getElementById("amount").value = localStorage.loan_amount;
    document.getElementById("apr").value = localStorage.loan_apr;
    document.getElementById("years").value = localStorage.loan_years;
    document.getElementById("zipcode").value = localStorage.loan_zipcode;
  }
};

// Передать ввод пользователя серверному сценарию, который может (теоретически) возвращать
// список ссылок на сайты местных кредитных учреждений, готовых предоставить кредит.
// Данный пример не включает фактическую реализацию такого сценария поиска кредитных
// учреждений. Но если такой сценарий уже имеется, данная функция могла бы работать с ним.
function getLenders(amount, apr, years, zipcode) {
  // Если броузер не поддерживает объект XMLHttpRequest, не делать ничего
  if (!window.XMLHttpRequest) return;

  // Отыскать элемент для отображения списка кредитных учреждений
  var ad = document.getElementById("lenders”);
  if (!ad) return; // Выйти, если элемент отсутствует

  // Преобразовать ввод пользователя в параметры запроса в строке URL
  var url = "getLenders.php" + // Адрес URL службы плюс
    "?amt=" + encodeURIComponent(amount) + // данные пользователя
    "&apr=" + encodeURIComponent(apr) + //в строке запроса
    "&yrs=" + encodeURIComponent(years) +
    "&zip=" + encodeURIComponent(zipcode);

  // Получить содержимое по заданному адресу URL с помощью XMLHttpRequest
  var req = new XMLHttpRequest(); // Создать новый запрос
  req.open("GET", url); // Указать тип запроса HTTP GET для url
  req.send(null); // Отправить запрос без тела

  // Перед возвратом зарегистрировать обработчик события, который будет вызываться
  // при получении HTTP-ответа от сервера. Такой прием асинхронного программирования
  // является довольно обычным в клиентском JavaScript,
  req.onreadystatechange = function() {
    if (req.readyState == 4 && req.status == 200) {
      // Если мы попали сюда, следовательно, был получен корректный НТТР-ответ
      var response = req.responseText; // HTTP-ответ в виде строки
      var lenders = JSON.parse(response); // Преобразовать в JS-массив

      // Преобразовать массив объектов lender в HTML-строку
      var list = "";
      for(var і = 0; і < lenders.length; i++) {
        list += "

"+

          lenders[i].name + "";

      }
      // Отобразить полученную HTML-строку в элементе,
      // ссылка на который была получена выше.
      ad.innerHTML = "

" + list + "

";

    }
  }
}

// График помесячного изменения остатка по кредиту, а также графики сумм,
// выплачиваемых в погашение кредита и по процентам в HTML-элементе .
// Если вызывается без аргументов, просто очищает ранее нарисованные графики,
function chart(principal, interest, monthly, payments) {
  var graph = document.getElementById("graph"); // Ссылка на тег