picha

JAVASCRIPT - somo la 22: Jinsi ya ku set time na tarehe

Katika somo hili tutakwenda kujifunza kuhusu ku set time. Yaani tutaweka muda ambao code zinatakiwa ndio zilete matokeo.

Soma wazo hili: 

Unatakiwa kutengeneza program ya chemsha bongo,  ambapo program itauliza swali kisha mtu atatoajibu ndani ya sekunde 10 endapo hajaweka jibu ataambiwa muda umekwisha

 

Sasa hapo ndipo tutahitani function ya ku set muda. Kufanya hivi kwa kutumia javascript tutatumia function unayoitaka setTimeout(). Jambo la kuzingatia ni kuwa muda hapa unahesabiwa kwa kutumia millsecond. sekunde 1 ni sawa na millsecond 1000. Hivyo ukitaka code zi fanye kazi baada ya dakika 5 hapo utaweka 5000. Sasa wacha tuone jinsi ambavyo tutaweza kuandika function yetu hii.

 

Kwanza  utaweka function yako setTimeout()  unaweza kuiweka ndani ya variable. Mfano var time = settimeout()

Pili ndani ya hiyo function utaweka statement zalo ukitengenisha na alama ya coma yaani (,) mfano var time = settimeout(function() {Document.write(“Muda umekwisha”)},) 

 

Tatu utaweka muda unaotaka baada ya hiyo koma. Mfano var time = settimeout(function() {Document.write(“Muda umekwisha”)}, 5000).

 

Angalia mfano wa hapo chini

<html>

<head>

 <title>Mafunzo ya javascript</title>

</head>

</html>

<body>

<h2>Jaza kitendawili hiki</h2>

<form>

 <label>Haba na haba hujaza _______________</label><br><br><br>

 <input type="text" placeholder="Jaza jibu hapa">

</form>

 

<script>

 var myTimeout = setTimeout(function (){ document.write("Muda umekwisha")}, 5000)

</script>

</body>


 

Sasa endapo hujajaza jibu na muda ukiisha Utaletewa ujumbe huo. 

 

Pia code hizo hapo unaweza kuzigeuza na kuziadika katika mtindo wa kuweka ku call function ndani ya setTimeout(). Matokeo ya code hizo hapo chini ni sawa na matokeo ya code hizo hapo juu.

 

<html>

<head>

 <title>Mafunzo ya javascript</title>

</head>

</html>

<body>

<h2>Jaza kitendawili hiki</h2>

<form>

 <label>Haba na haba hujaza _______________</label><br><br><br>

 <input type="text" placeholder="Jaza jibu hapa">

</form>

 

<script>

 function quiz (){ document.write("Muda umekwisha")}

 var myTimeout = setTimeout(quiz, 5000)

</script>

</body>

 

setInterval

Sasa ikitokea unahitaji ku excute code kila baada ya muda fulani hapa utatumia setinterval. Somo la hapo juu tumezungumzia ku excute code baada ya muda fuani, lakini hapa ni kila baada ya muda fulani. 

 

Mfano:

Umetakiwa kuweka program ya kuesabu muda yaani sekunde. Kisha uweke kwenye program ya kuuliza swali. Hivyo itakuwa ukihesabu zikitimia sekunde flani in stop.

 

Kufanya hivi tutatumia function ya setinterval. kwa mfano hapo tutaset program ya kuhesabu kila baada ya millsecond 1000 maana kila baada ya dakika 1.

 

Kanuni za kuandika setInterval ni sawa na zile za kuandika setTimeout. Kikubwa cha kuzingatio ni kuwa timeInterval itakuwa inaendelea ku excute kila baada ya huo muda ulioweka bila ya kikomo mpaka pale utakapo fanya i stop.

 

<html>

<head>

 <title>Mafunzo ya javascript</title>

</head>

</html>

<body>

<p id="showTime"></p>

<script>

 var hesabu = 0;

 var muda = setInterval(function (){

   hesabu += 1;

   document.getElementById("showTime").innerHTML = hesabu;

 }, 1000);

</script>

</body>

 

Unaweza kuweka timeinterval zaidi ya moja kwenye code, pia unaweza kucanganya na setTimeout zaidi ya moja kweye ukurasa mmoja. Sasa kama nilivyo kueleza kuwa code zitaendelea ku excute kila baada ya muda fulani, mpaka utakapo sitisha kufanya hivyo.


 

Jinsi ya kusitisha timeInterval() na setTimeout():

ili kuweza kusitisha settimeout() tutatumia method hii clearTimeout() na ukitaka kusitisha setinterval() tutatumia method hii clearInterval()

 

Mfano 1: kusitisa setinterval

<html>

<head>

 <title>Mafunzo ya javascript</title>

</head>

</html>

<body>

<id="showTime"></p>

<button onclick="sitisha()">Sitisha Muda</button>

<script>

 var hesabu 0;

 var muda setInterval(function (){

   hesabu += 1...

Jiunge nasi WhatsApp kupata update zetu

Zoezi la Maswali

Nyuma Endelea


Umeionaje Makala hii.. ?

Nzuri            Mbaya            Save
Author: Rajabu image Tarehe: 2023-10-20 Topic: JavaScript Main: ICT File: Download PDF Views 753

Share On:

Facebook WhatsApp
Sponsored links
👉1 Madrasa kiganjani    👉2 web hosting    👉3 Bongolite - Game zone - Play free game    👉4 Dua za Mitume na Manabii    👉5 Kitau cha Fiqh    👉6 Simulizi za Hadithi Audio   

Post zinazofanana:

JAVASCRIPT - somo la 4: Jinsi ya kuandika variable kwenye javascript

Katika somo hili utajifunza jinsi ya kuandika variable. Hapa utajifunza sheria zinazohusu variable katika javascript

Soma Zaidi...
Offline data handle kwa kutumia javascript

Katika somo hili tutaenda kujifunza namna ya kuhifadhi taarifa za mtumiaji endapo mtandao utakuwa haupo ()

Soma Zaidi...
JAVASCRIPT - somo la 14: Jifunze kuhusu event kwenye javascript

Katika somo hili utakwenda kujifunza kuhusu javascript events. Event ni neno la Kiingereza lenye maana tukio wingi wake events kumaanisha matukio. Natumia ni kila ambacho kinatokea kwenye javascript.

Soma Zaidi...
JAVASCRIPT - somo la 24: Jinsi ya kutengeneza online keyboard

Katika project hii utakwenda kufunza jinsi utakavyoweza kutengeneza keyboard ya online kwa kutumia javascript

Soma Zaidi...
JAVASCRIPT - somo la 2: Jisi ya ku print output ya code za javascript.

Katika somo hili utakwenda kujifunza jinsi ambavyo utaweza ku display matokeo ya code za javascript.

Soma Zaidi...
Game 3: Mchezo wa kufikiria namba kwa kutumia javascript

Hii ni game ambayo utafikiria namba, ambayo inatakiwa iwe sawa na namba ambayo game imeiweka.

Soma Zaidi...
JAVASCRIPT - somo la 9: Jinsi ya kuandika function kwenye javascript

Katika somo hili utakwenda kujifunza jinsi ya kuandika function kwenye javascript. Utajifunz apia namna ya kuitumia function hiyo

Soma Zaidi...
JAVASCRIPT - somo la 10: Jinsi ya kuandika object na matumizi yake kwenye javascript

Ksomo hili litakwenda kukufundisha kuhusu object kwenye javascript, kazi zake na sheria zake katika kuiandika.

Soma Zaidi...
JAVASCRIPT -somo la 1: Kwa nini ni muhimu kujifunza javascript

Katika somo hili utajifunza kuhusu historia ya javacsript pamoja na kazi za javascript. Pia utayajuwa makampuni makubwa yanayotumia javascript.

Soma Zaidi...
JAVASCRIPT - somo la 23: Jinsi ya kutengeneza calculator yaani kikokotoo cha hesabu kwa kutumia javascript

Katika somo hili utakwenda kujifunza jinsi ambavyo utaweza kutumia javascript kutengeneza kikokotoo cha hesabu yaani calculator

Soma Zaidi...