framedesignlab.com

JavaScript е добре познат и широко използван скриптов език, използван най-вече за писане на приложения за уеб страници. Можете да създадете стотици полезни приложения, използвайки JavaScript, включително таймер за обратно отброяване. Можете да кодирате JavaScript скрипт, за да покажете отброяване от 10 до нула на вашата уеб страница и да покажете съобщение, когато достигне нула. JavaScript скриптове могат да бъдат създадени във всеки текстов редактор, като Notepad и WordPad, но трябва да бъдат запазени с разширение ".js", за да бъдат функционални.

1

Създайте нов текстов файл и го кръстете "timer.js." Разширението ".js" показва, че това е JavaScript файл. Отворете файла в текстов редактор, като Notepad или WordPad.

2

Определете две променливи (Timer и TotalSeconds), като вмъкнете тези два реда:

var Таймер; var TotalSeconds;

3

Създайте нова функция (CreateTimer), която показва таймера на вашата уеб страница, като вмъкнете този код:

функция CreateTimer (TimerID, Time) {Timer = document.getElementById (TimerID); TotalSeconds = Време; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

"Window.setTimeout (" Tick () ", 1000);" функцията прави отметката на таймера на всяка секунда. Сега вашият скрипт изглежда така:

var Таймер; var TotalSeconds;

функция CreateTimer (TimerID, Time) {Timer = document.getElementById (TimerID); TotalSeconds = Време; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

4

Добавете функция, която принуждава таймера да намалява с една секунда всеки отметка:

функция Tick () {if (TotalSeconds <= 0) {alert ("Времето изтече!") return; } Общо секунди - = 1; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

Аргументът „if (TotalSeconds <= 0)“ гарантира, че отброяването спира на нула и показва „Времето изтече! съобщение. "Window.setTimeout (" Tick () ", 1000);" функция гарантира, че броенето продължава, докато достигне нула.

5

Вмъкнете функция за актуализиране на таймера всеки отметка, така че да можете да видите обратно броене:

функция UpdateTimer () {Timer.innerHTML = TotalSeconds; }

6

Сега вашият скрипт изглежда така:

var Таймер; var TotalSeconds;

функция CreateTimer (TimerID) {Timer = document.getElementById (TimerID); Общосекунди = 10; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

функция Tick () {if (TotalSeconds <= 0) {alert ("Времето изтече!") return; } Общо секунди - = 1; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

функция UpdateTimer () {Timer.innerHTML = TotalSeconds; }

7

Запазете файла. За да използвате скрипта на уеб страница, използвайте този HTML код: