- •JavaScript сабақтары Неден бастайық?!
- •Негізгі ұғымдар
- •Объектілік модель
- •Терезенің өлшемі мен орны
- •Модальды сұхбат/диалог
- •Оқиғалар
- •Формалар
- •Форманың толымдылығын тексеру
- •Тайминг
- •Құжатты оқып-үйренуді жалғастырамыз
- •Презентациялар жасау (жиымдар мен суреттерге ауысамыз)
- •Презентациялар (кодтың сипаттамасы)
- •Суреттер және тышқан оқиғасы
- •Фотоальбом құрайық
- •Суретті ауыстыру үшін сілтемені шертіңіз (бұл жерде олар істемейді, тек мысал үшін ғана):
- •Суреттерді үлкейту
Оқиғалар
Ең әуелі Web-программалау тілінің қайсысы екендігіне қарамастан оқиғалар ұғымының не екендігін анықтап алайық. Мен қазір міне компьютерде жазба жазып отырмын. Міне осы, яғни пайдаланушының компьютерде атқарған жұмысының бәрі, машинаның (компьютердің) көзімен қарағанда – оқиға болып табылады. Пайдаланушының пернетақтадағы пернені басуы, тышқанды қозғауы, жаңа терезе ашып, оны жабуы, сілтемемен басқа параққа ауысуы, форманың өрісін толтыруы, сілтемеге тышқанды апаруы – осының барлығы оқиға екен.
Java Script осы оқиғаларға жауап қайтаруды программалауға, сөйтіп парақшаны жандандыруға мүмкіндік жасайтын икемді құралдар ұсынады. Әр оқиғаға белгілі бір әрекетті меншіктеуге мүмкіндік беретін өңдеуіш болады.
Алдымен HTML- құжатқа Java Script-терді және оның функциясы – alert-ті қалай қоюды қарастырайық, бұл бізге оқиға өңдеуіштің мысалы үшін ғана қажет болып тұр.
HTML- құжатқа Java Script мына жақтауға (тэгтер жұбына) алынып енгізіледі:
<script language=javascript>
Бұл жерге код ...
...
</script>
Ал alert функцииясының синтаксисі мынадай:
Alert (жазылатын мәтін тырнақшаға алынады);
Мысалы:
<script language=javascript>
alert("Сіз басқа батырманы бастыңыз!!!");
</script>
Ал енді оқиғаны қарастырайық:
1.onmouseover – тышқанның тінтуірі обьектіні көрсеткен сайын пайда болады. Мұнда обьект ретінде сілтеме де, батырма да, форма өрісі де (форма жайлы кейінгі тарауда айтамыз) бола алады. Оқиға өңдеуші onmouseover javascript-тің программаларын орындайды. Кәне қандай да бір сілтеме (қайда сілтегені маңызды емес) құрайық және оған сол оқиғаны өңдеуішті бекітейік:
<a href="#" onmouseover="alert("Сіз тышқанды сілтемеге қойдыңыз");">Сілтеме</a>
Оқиға өңдеуішінің жазылуына назар салыңыз. Мұнда оны тэг атрибуттарымен бірге, оның Java Script екенін көрсетпей-ақ жазуға болады екен. Онда тек Java Script-тің тағы бір ерекшелігін: барлық функциялар мен операторлардың барлығы нүктелі үтірмен аяқталуы тиіс екендігін ұмытпау керек. Міне осыған қоса біз alert функциясының не істейтінін де білдік.
Кәне енді қандай оқиға өңдеуіштері бар екен, соларды қарастырайық (бірдеңе онша түсініксіз болып жатса, оған қапаланбаңыз, бұл әлі бастамасы ғой):
2. onmouseout – пайдаланушы обьектіден тышқан тінтуірін алып кетті; 3. onMouseMove – пайдаланушы тышқанды экран бетімен қозғады; 4. onclick – пайдаланушы обьектіні шертті (шақырды); 5. onload - ашу (құжатты жүктеу). Әдетте <body> тэгінде қолданылады. Мысалы: <body onload="alert("Парақ жүктелді");"> 6. onunload – сіз парақтан шықтыңыз. Мысалы: <body onunload="alert("Кіргеніңізге рахмет!!!");"> 7. onblur – форманың select, text немесе textarea өрістері фокустарын жоғалтқан кезде пайда болады; 8. onchange - форманың select, text немесе textarea өрістері фокустарын жоғалтқан кезде немесе мәндерін өзгерткен кезде пайда болады; 9. onfocus – өріс фокусты пернетақтадан енгізу немесе тышқанмен шерту арқылы алған кезде пайда болады; 10. onselect – пайдаланушы кейбір мәтінді text немесе textarea өрісінің ішінен таңдаған кезде пайда болады; 11. onsubmit – пайдаланушы форманы Web-серверге жөнелткен кезде пайда болады.
Сонымен біз жалпы мақсаттағы көбірек қолданылатын оқиғаларды қарастырдық.
Көптеген оқиғалар нақты обьектілерге бекітіледі. Атап айтқанда, жоғарыда айтылған 7-11 пункттегі оқиғалар форма обьектілеріне жатады. Келесі мақала формаларға, олармен байланысты оқиғаларға арналады.
