Каким образом можно создать точку останова? Например, если в Лекции 8 в примере, который демонстрирует возможность <canvas> для работы с готовыми изображениями (последний в лекции) в цикле |
Опубликован: 19.03.2014 | Доступ: свободный | Студентов: 328 / 27 | Длительность: 11:36:00
Специальности: Программист
Практическая работа 8:
Работа с данными в памяти мобильного устройства
- Разработку страницы Like.html начните с наполнения JS-файла sessionStorage.js следующим кодом JavaScript:
function initiate() { var button = document.getElementById('button'); button.addEventListener('click', newitem, false); show(); } function newitem() { var keyword = document.getElementById('keyword').value; var value = document.getElementById('text').value; sessionStorage.setItem(keyword, value); show(); document.getElementById('keyword').value = ''; document.getElementById('text').value = ''; } function show() { var databox = document.getElementById('databox'); databox.innerHTML ='' ; for (var f = 0; f < sessionStorage.length; f++) { var keyword = sessionStorage.key(f); var value = sessionStorage.getItem(keyword); databox.innerHTML += '<div>' + keyword + ' - ' + value + '</div>'; } } window.addEventListener('load', initiate, false);
По содержанию созданный sessionStorage.js подобен localStorage.js.
- Наполним страницу Like.html следующим кодом разметки:
<!DOCTYPE html> <html lang="ru"> <head> <title>Like</title> <link rel="stylesheet" href="css/index.css"> <script type="text/javascript" src="js/sessionStorage.js"></script> </head> <body> <h3> <img src="img/tab.jpg" width="40" height="40"> <a href="Product.html"> Список товаров</a> <img src="img/tel.jpg" width="40" height="40"><a href="Basket.html"> Корзина</a><br></h3> <section id="formbox"> <form name="form"> <p>Фирма производитель:</p> <p><input type="text" name="keyword" id="keyword"></p> <p>Характеристики:<br /><input type ="text" name="text" id="text" ></p> <p><input type ="button" id ="button" name ="button" value="Отправить"/></p><br /> </form> <h2>Мои заказы:</h2> <section id = "databox"> Мои заказы: </section> <br /> </section> </body> </html>
В приведенном коде используются средства работы с временной памятью мобильного устройства из sessionStorage.js.
Вводимые пользователем данные (фирма, характеристики) сохраняются в sessionStorage и сразу выводятся в поле databox страницы.
Результаты запуска страницы Like.html:
Результат нажатия кнопки "Отправить":