Baxış: Bu yazıda JavaScript browser hadisələr haqqında müzakirə edəcək. Onlar vəzifələrin ən yerinə kimi Java script hadisələr çox vacibdir. digər mühüm məqam browser uyğunluğu edir. java script html faylları əlaqədar kimi, java script icrası asılıdır browser edir. Java scripts də browser hadisələri idarə etmək üçün kifayət qədər çatmış olunur.
Giriş:
A browser hadisə fəaliyyət həyata keçirilir halda tətbiqi brauzer siqnaldır. Bu hadisələr aşağıdakı var
- DOM Events: Bu DOM elementləri e.g təşəbbüsü ilə. bir element tıklandığında bir klik hadisə səbəb və ya siçan pointer bir element hovered zaman hadisə üzərində siçan səbəb olur. Bu hadisələr sənəd ilə bir java script kodu əlaqə.
- Window Events: Bu brauzer pəncərəsində boyutlandırılır zaman təşəbbüsü.
hadisələr hansılardır?
Bir hadisə java script üçün bir siqnal göndərir bir hərəkət / iş kimi müəyyən edilə bilər. İndi java script bir hadisə cavab icra. Amma hadisə müvafiq java script komponentinə siqnal göndərmək üçün qeydiyyata alınmalıdır. Sonra hadisələr bəzi.
Window hadisələr: browser window boyutlandırılır zaman Bu hadisələr təşəbbüsü.
DOM hadisələr: bir DOM element bəzi fəaliyyət həyata zaman bu təşəbbüsü.
Digər tədbirlər: Bu hadisələr ayrı yuxarıda iki hadisələr bütün digər növləri nəzərdən.
Hadisə işleyicileri: Biz Java və java script arasında böyük fərq olduğunu anlamaq lazımdır. Java, Çox Threading mümkündür lakin java script hadisələr yivli tək. Belə ki, hadisə işleyicileri ardıcıl icra olunur. işıqlandırmaq üçün, Bizə bir istifadəçi iki hadisə çıxış edib fərz edək, mouseover və sonra MouseMove. Belə ki, mouseover hadisə ilk edam ediləcək. ilk tədbir tamamlandığında, MouseMove hadisə edam olacaq.
bir script bir hadisəyə qarşı bir hərəkət yerinə yetirmək üçün var, əgər, bu bağlı bir funksiyası olmalıdır. Bu funksiyaları hadisə işleyicileri kimi istinad edilir. Adətən bu funksiyaları formatında adına - EVENT_NAME e.g on. onclick s. java script Hadisə işleyicileri yivli tək və ardıcıl icra. iki hadisə eyni zamanda baş Beləliklə əgər, Onların işleyicileri bir-birinin ardınca icra olunacaq. Tədbirdə işleyicileri təyin olunur ki, bir çox yolu vardır. These are.
HTML tag istifadə: Tədbirdə handler-hadisə atributu istifadə biçimlendirme birbaşa bağlı ola bilər.
Listing 1: Event handler using html tag
[Code]
<input id = “b1” value = “məni basın” onclick = “alert("Thanks! Mən tıklayan edirəm. ‘); ” type = “düymə” />
[/Code]
Bu kodu icra zaman, biz bir etiket ilə bir düyməsinə görmək – "Mənə basın". istifadəçi bir mesaj ilə bu düyməni bir uyarı pəncərə edib – Təşəkkür! Mən tıklayan edirəm. Biz də hadisə user üçün bir funksiyası zəng edə bilərsiniz. aşağıdakı kodu düşünün
Listing 2: funksiyası istifadə hadisə handler
[Code]
| <!DOCTYPE HTML> | |||||||||||||||
| <html> | |||||||||||||||
| <baş> | |||||||||||||||
| <script type =”text / javascript”> | |||||||||||||||
| function count_rabbits() { | |||||||||||||||
| uğrunda(var i = 1; mən <= 3; i ) { | |||||||||||||||
| alert( “dovşan “+i ” papaq həyata!” ) | |||||||||||||||
| } | |||||||||||||||
| } | |||||||||||||||
| </yazı> | |||||||||||||||
| </baş> | |||||||||||||||
| <bədən> | |||||||||||||||
| <input type = “düymə” onclick = “count_rabbits()” value = “dovşan Count!”/> | |||||||||||||||
| </bədən> | |||||||||||||||
| </html>[/Code]Bu cari element aiddir harada hadisə lər üçün başqa bir yanaşma this.innerHTML istifadə edir. Aşağıdakı kod bu göstərirListing 3: this.innerHTML istifadə hadisə handler
[Code] <düyməsini onclick = “alert ( this.innerHTML )”> Məni görmək məni basın </düymə> [/Code] DOM Object Əmlak istifadə: Burada tapşırıq əmlak istifadə edilir – onevent. Bu halda biz ilk element almaq və sonra əmlak onevent bir handler təyin etmək lazımdır. The following code is an example of setting a click handler to the element with id ‘myId’ Listing 4: DOM Object Əmlak istifadə hadisə handler [Code] <input id = “myid” type = “düymə” value = “məni basın”/> <yazı> document.getElementById( ‘ myid ‘ ).onclick = funksiyası() { alert("Thanks") } </yazı> [/Code] Burada aşağıdakı iki şey istifadə etmək üçün qeyd etmək lazımdır – · It is a property, bir atributu və onun adı halda həssas və aşağı halda olmalıdır onevent edir. · The handler should be a function not a String. browser HTML biçimlendirme bir onevent atributu tapır, onun məzmunu istifadə edərək, bir funksiyası yaradır və mülkiyyət üçün verir. Aşağıdakı iki kodları Belə ki, eyni deyil Listing 5: yalnız HTML istifadə hadisə handler [Code] <input type = “düymə” onclick = “alert( basın!’ )” value = “düymə”/> [/Code] Listing 6: HTML istifadə hadisə handler & JS. [Code] <input type = “düymə” id = “düymə” value = “düymə”/> <yazı> document.getElementById('Düyməsinə ").onclick = funksiyası() { alert(basın!’) } </yazı> [/Code] JavaScript biçimlendirme müəyyən bir handler üzerine yazır. Aşağıdakı parçasını yeni bir ilə bir biçimlendirme handler əvəz Listing 7: bir handler sıra yadda. <input type =”düymə” onclick =”alert("Əvvəl")” value=”məni basın”/> <yazı> document.getElementsByTagName('Giriş')[0].onclick = funksiyası() { alert("Sonra") } </yazı> [/Code] Xüsusi üsulları istifadə edərək,: mürəkkəb JavaScript proqram, müxtəlif interface üsulları ümumi hadisə xüsusi üsulları işleyicileri təyin etmək üçün istifadə olunur idarə harada. Microsoft yalnız az IE versiyası ilə işləyir bir həll edir 9 həmçinin Opera ilə. Handlers təyin və altında ayrılır Listing 8: işleyicileri əlavə və aradan qaldırılması element.attachEvent( “haqqında” + hadisə, handler) [/Code] bir handler aradan qaldırılması – [Code] element.detachEvent( “haqqında” + hadisə, handler) [/Code] hadisə əlavə istifadə, eyni element çox işleyicileri təyin edə bilər. Aşağıdakı kod parçası bu göstərir Listing 9: bir element çox işleyicileri təyin. [Code] <input id = “myElement” type = “düymə” value = “məni basın” /> <yazı> var myElement = document.getElementByID( “myElement” ) hərəkət edirdi = funksiyası() { alert( "Thanks!’ ) } idi biznesmen 2. = funksiyası() { alert( 'Bir daha təşəkkürlər!’ ) } myElement.attachEvent( “onclick”, handler) myElement.attachEvent( “onclick”, handler2) </yazı> [/Code] parametri 'Bu "keçmir hadisələr əlavə. W3C standart uyğun olaraq aşağıdakı handler tapşırıq bu gün istifadə olunur, demək olar ki bütün brauzerlər işləyir. bir handler əlavə Listing 10: Əlavə və W3C uyğun olaraq işleyicileri aradan qaldırılması element.addEventListener ( hadisə, handler, faza ) [/Code] element. removeEventListener ( hadisə, handler, faza ) [/Code]
Hadisə ilə əlaqədar tədbirlər: Tədbirdə bağlı tədbirlər user edərkən aşağıdakı dörd tədbirlər qayğı olmalıdır · hadisə handler Qeydiyyat: Bu elementlər onevent əmlak e.g qəbulu ilə edilə bilər. onclick və ya onkeypress s. Bu, bütün brauzeri ilə işləyir, lakin biz bir element üçün yalnız bir hadisə handler əlavə edə bilərsiniz bir məhdudiyyət var. əlavə tədbirlər detachEvent ya removeEventListener istifadə oxşar moda çıxarıla bilər. · Tədbirdə obyekt almaq: brauzerlər əksəriyyəti handler bir arqument kimi hadisə obyekt keçmək. istifadəçi klik aşağıdakı üç hadisə yaradılan. o Mousedown: siçan bərk olduğunu göstərir. o Mouseup: siçan azad olduğunu göstərir. o Click: siçan tıklandığında olduğunu göstərir. bu ardıcıllıqla baş verərsə, bu cüt basın oldu göstərir ki. · Extract information from the object – Üçüncü addım obyekt çıxarış fəaliyyət ilə bağlı məlumat və fəaliyyət başlamaq. · Inform about the completion of the event – Bu son addım. Tədbirdə uğurla hərraca sonra hadisə başa qeyd olunur. Summary: müzakirə bağlamaq üçün biz nəzərə aşağıdakı xal saxlaya bilərsiniz · Used to initiate an action which should be performed as per the customers need. · Events are of two types – DOM hadisələr və Window hadisələr. · Event handlers are functions associated to events. · Event handlers are assigned in the following way o Using HTML tag o Using DOM object property o Using special methods |
||||
READ MORE JAVA SCRIPT ARTICLES
Java Script Design Patterns
CSS3 & JavaScript
Java Script and CSS3 properties
