Bazi Eventlarin Browser Uyumluluk Tablosu

Event compatibility tables


Event Explorer 5 Windows Explorer 6 Windows Explorer 5.2 Mac Mozilla 1.75 Safari 1.3 Opera 8 Netscape 4
blur, focus
The blur event fires when an element loses focus.
The focus event fires when an element gains focus.

On a window, these events usually also fire when the window loses or gains focus because another element like a form field or a link gains or loses focus.

If the user clicks on a link, the link gains the focus and keeps it until another element gains the focus.

Curiously, W3C has never recognized the existence of these events on windows. 		Test page window
Yes Yes Yes Buggy Yes Yes Yes
window.onfocus = doSomething;
  • In Mozilla hiding and showing the window fires both events three times. Clicking on the window also fires the focus event.
    If it must work perfectly in Mozilla and you don't care about Netscape 4, use document.body.onfocus.
Test page Link element
Yes Yes Incomplete Incomplete Incomplete Incomplete No
document.links[0].onblur = doSomething;

A perfect implementation would allow focusing and blurring both by a click on the link and by TABbing to the link.
Opera only supports the click; Mozilla, Safari and Explorer Mac only the TAB.
Note that in Safari you explicitly have to switch on tabbing to links in the Advanced preferences panel.
Test page Form fields
Yes Yes Yes Yes Incomplete Yes Yes
document.forms[0].elements[1].onblur = doSomething;
  • Safari supports these events only on text elements.
contextmenu
The contextmenu event fires whenever the user calls up a context menu. 		Test page document
Yes Yes No Yes Yes No No
document.oncontextmenu = doSomething;
Event Explorer 5 Windows Explorer 6 Windows Explorer 5.2 Mac Mozilla 1.75 Safari 1.3 Opera 8 Netscape 4
load
The load event fires when an HTML document has been loaded completely, including all images, and arrays such as document.images have been initialized. You should run your own initializing scripts onload.		 Test page window
Yes Yes Yes Yes Yes Minimal and alternative Yes
window.onload = doSomething;
  • Opera is being obnoxious
    The event does not fire when the user uses Back or Forward (see unload)
    Besides, it does not see <body onload> and window.onload as the same event; test it here.
    This code: 
    window.onload = doSomething1;
    <body onLoad="doSomething2()">
    should only execute doSomething2(), because the earlier onload is overwritten by the later one. However, Opera executes both scripts.
    Opera itself says this is the correct way to handle onload. Although this may be true, it will certainly cause compatibility problems.
resize
The resize event fires while the user resizes the browser window. A major resize job causes the event to fire many times over 		Test page window
Yes Yes Yes Alternative Yes Yes Buggy until 4.5
window.onresize = doSomething;
  • Mozilla fires the event once after the user has stopped resizing the window.
  • It seems that Explorer Windows on Win98 fires the event only twice, after the resizing has stopped. On XP it fires continuously.
  • In early Netscape 4's (until about 4.5) the resize event also fires when a page has finished loading, just after the load event.
Event Explorer 5 Windows Explorer 6 Windows Explorer 5.2 Mac Mozilla 1.75 Safari 1.3 Opera 8 Netscape 4
scroll
The scroll event fires when the user scrolls a page, a frame or an element with overflow: auto in any way supported by the browser: by using the scrollbar, the arrow keys or the mouse wheel. 		Test page window
Yes Yes Yes Minimal Yes Yes No
window.onscroll = doSomething;
  • Mozilla only fires the event when the user uses the scrollbar. Since you cannot be certain to capture a scroll event, I judge its support Minimal, not Incomplete.
Test page element with overflow: auto
Yes Yes Yes Yes Yes No Untestable
x.onscroll = doSomething;
where x is an element with overflow: auto
  • Netscape 4 doesn't support overflow: auto
unload
The unload event fires whenever the page is unloaded for whatever reason.
It is not possible to distinguish between the user going to another page and the user closing the entire window, the unload event always fires. It is also not possible to cancel the unloading of the page. 		Test page window
Yes Yes Yes Yes Yes Minimal Yes
window.onunload = doSomething;
  • In Opera load and unload do not fire when the user uses Back or Forward to enter or leave a page, or when the user closes the window.
    This severely hampers the usefulness of the events. When I write a load or unload script to, for instance, adjust the navigation of this site, I want it to run whenever the user enters or leaves the page, and not just when a browser thinks it's appropriate.
    Therefore I judge Opera's support Minimal and not Incomplete.
  • Safari 1.3 hardly ever fires the unload event, although it works fine in 1.2 and 1.3.1

Mouse events


Event Explorer 5 Windows Explorer 6 Windows Explorer 5.2 Mac Mozilla 1.75 Safari 1.3 Opera 8 Netscape 4
click
The click event fires after one mousedown and one mouseup event have taken place on the same element.

Correct order:
  1. mousedown
  2. mouseup
  3. click

On links the event should also fire when the user tabs to the links and then hits Enter. 		Test page document
Yes Yes Yes Yes Yes Yes Yes
document.onclick = doSomething;
Test page Link elements
Yes Yes Incomplete Yes Yes Yes Yes
document.links[0].onclick = doSomething;

  • In Explorer Mac, hitting Enter when the focus is on the link doesn't fire the click event.
  • Tabbing to a link is impossible in Opera and Safari. Officially the click event works fine, though, and the problem lies in the lack of Tab functionality.
Test page Any other element
Yes Yes Yes Yes Yes Yes Incomplete
x.onclick = doSomething;
where x is any HTML element
  • Netscape 4 does not count clicks on the text and requires captureEvents()
Test page Form fields
Yes Yes Incomplete Yes Almost Yes Incomplete
document.forms[0].elements[1].onclick = doSomething;
  • Safari fires the click event on a select box onblur
  • Netscape 4: Not on textareas and selects
  • Explorer Mac: Not on selects
Event Explorer 5 Windows Explorer 6 Windows Explorer 5.2 Mac Mozilla 1.75 Safari 1.3 Opera 8 Netscape 4
dblclick
The dblclick event fires after the user has clicked twice in rapid succesion on the same element. All browsers support it.
The incompatibilities are in the succession of events leading up to the dblclick. Every browser uses a different event order.

In practice it is not possible to use both the click and dblclick events on the same element. The browsers aren't sufficiently able to distinguish between them. 		Test page Link element
Yes Yes Yes Yes Yes Yes Yes
document.links[0].ondblclick = doSomething;

The order of events leading up to the dblclick:
  • Explorer Windows: mousedown mouseup click mouseup dblclick
  • Explorer Mac: mousedown mouseup click mousedown dblclick
  • Mozilla: mousedown mouseup click mousedown mouseup click dblclick
  • Safari: mousedown mouseup click mousedown mouseup dblclick
  • Opera: mousedown mouseup click click dblclick mouseup
  • Netscape 4: mousedown mouseup mousedown mouseup dblclick
Test page Any element
Yes Yes Yes Yes Yes Yes Yes
x.ondblclick = doSomething;
where x is any HTML element
  • Netscape 4 requires captureEvents()
mousedown, mouseup
The mousedown event fires when the user depresses the mouse button.
The mouseup event fires when the user releases the mouse button.
If these two events take place on the same element, a click event fires.		 Test page document
Yes Yes Yes Yes Yes Yes Yes
document.links[0].onmousedown = doSomething;
Test page Link element
Yes Yes Yes Yes Yes Yes Yes
document.links[0].onmousedown = doSomething;
Test page Any element
Yes Yes Yes Yes Yes Yes Yes
x.onmousedown = doSomething;
where x is any HTML element
  • Netscape 4 requires captureEvents()
mouseenter, mouseleave
The mouseenter and mouseleave events are subtly different from mouseover and mouseout. See the Mouse events page for an explanation of the differences.
mouseenter fires after mouseover, mouseleave before mouseout.		 Test page Link element
5.5 Yes No No No No No
document.links[0].onmouseenter = doSomething;
Test page Any element
5.5 Yes No No No No No
x.onmouseleave = doSomething;
where x is any HTML element

I must admit I expected support by some minor browser when I included these Microsoft events in the test program.
Event Explorer 5 Windows Explorer 6 Windows Explorer 5.2 Mac Mozilla 1.75 Safari 1.3 Opera 8 Netscape 4
mousemove
The mousemove event fires whenever the user moves the mouse. It continues firing as long as the mouse moves.		 Test page document
Yes Yes Yes Yes Yes Yes Yes
document.onmousemove = doSomething;
  • Netscape 4 requires captureEvents()
Test page Any element
Yes Yes Yes Yes Yes Yes Yes
x.onmousemove = doSomething;
where x is any HTML element
  • Netscape 4 requires captureEvents()
mouseover, mouseout
The mouseover event fires when the mouse enters the area of the element. The mouseout event fires when the mouse leaves the area again.		 Test page Link element
Yes Yes Yes Yes Yes Yes Yes
document.links[0].onmouseover = doSomething;
Test page Any element
Yes Yes Yes Yes Buggy Yes Yes
x.onmouseout = doSomething;
where x is any HTML element
  • Safari fires separate events for mouseovers and -outs on the text contained by element x
  • Mozilla 1.2 did the same, but the bug was solved in 1.3

Form events

See also the key to my compatibility tables.

Event Explorer 5 Windows Explorer 6 Windows Explorer 5.2 Mac Mozilla 1.75 Safari 1.3 Opera 8 Netscape 4
change
The change event should fire immediately after any form element changes its state.

Text fields fire the event onblur when their content has changed.
Selects fire the event onclick at the moment of option selection.
Checkboxes and radio buttons should fire the event onclick 		Test page Form fields
Almost Almost Almost Yes Incomplete Incomplete Incomplete
document.forms[0].elements[1].onchange = doSomething;
  • Checboxes and radios in Explorer fire the event onblur, which is too late.
  • Opera does not support this event on radios.
  • Netscape 4 does not support this event on checkboxes and radios.
  • Safari does not support this event on radios.
  • No browser fires the event after a reset has cleared all form fields.
reset
The reset event fires when the user resets the form.		 Test page Form element
Yes Yes Yes Yes Yes Yes Yes
document.forms[0].onreset = doSomething;
select
The select event fires when the user has selected text in a text field. It should fire onmouseup, when the user finishes selecting. 		Test page Form fields
Alternative Alternative Yes Yes No Yes No
document.forms[0].elements[1].onselect = doSomething;
  • Explorer Windows fires the event whenever any character is added to or removed from the selection
submit
The submit event fires when the user submits the form. It does not fire when a script submits the form (document.forms[0].submit()).		 Test page Form element
Yes Yes Yes Yes Yes Yes Yes
document.forms[0].onsubmit = doSomething;

Key events

Event Explorer 5 Windows Explorer 6 Windows Explorer 5.2 Mac Mozilla 1.75 Safari 1.3 Opera 8 Netscape 4
keydown, keypress, keyup
keydown and keypress keep firing continuously as long as the user keeps a key depressed. keyup fires once when the user releases the key.

In Netscape 4 the keydown event fires only once, when the user initially depresses the key. In all other browsers there is no difference between keydown and keypress.

 Test page Document
Yes Yes Yes Yes Yes Yes Yes
document.onkeydown = doSomething;
Test page Form fields
Yes Yes Yes Yes Yes Yes Yes
document.forms[0].elements[1].onkeydown = doSomething;
Support on text fields is enough to merit a Yes.

If you want to prevent the default action (ie: prevent the character from being inserted), you must use the keypress event.

Miscellaneous events

abort
The abort event fires when the user aborts the loading of images or the page. 		It's very hard to create tests for the abort event. I'd need a test file of 12.5 Meg, to make sure that even on a fast 10 Mb/sec connection the user of the test has about 10 seconds to realize that to test the abort event he should stop the downloading and then to actually do it.

Besides the event is completely useless. I never needed it myself, nor did I ever encounter any site that uses it.

Just forget abort.
Event Explorer 5 Windows Explorer 6 Windows Explorer 5.2 Mac Mozilla 1.75 Safari 1.3 Opera 8 Netscape 4
error
The error event fires when a JavaScript error has occurred (window) or when a image cannot be found (img elements). 		Test page window
? ? ? ? ? ?
window.onerror = doSomething;

The event test now fails in all browsers on all levels. That's odd, because I'm pretty sure it used to work.
Test page Image element
Yes Yes Yes Yes Yes Yes Yes
<img src="404.gif" onerror="doSomething()">

It's best to use inline event registration for this event because the error event may fire before the page has completely loaded, in which case an event handler registered onload wouldn't capture it.
DOMSubtreeModified
The DOMSubtreeModified event of an element fires whenever any change occurs in the node tree of the descendants of the element.		 Test page Any element
No No No No No No No
x.addEventListener('DOMSubtreeModified',doSomething,false);
where x is any HTML element

This is the most general of W3C's DOM events, and the only one I test for now. Note that the use of the W3C event registration model is required.

 Kaynak www.quirksmode.org/js/events_compinfo.html

16,527 Okunma Henüz yorum yapılmamış 01/08/2007 23:50:44

Yorumunuzu Ekleyin
Görsel Liste


Javascript Ve Ses

18,793 okuma,

Another Way To Access An Element (node Mantığı)

Html taglarına erişiminin farklı bir yolu

22,029 okuma,

Event Fonksiyonu

JavaScript ile bir fonksiyon yazdım ve başka yerlerden bu fonsiyonu çağırdım. Ancak, fonksiyona gelen isteğin, hangi nesneden geldiğini öğrenmek için, yeni bir parametre tanımlamak zorunda kaldım

26,786 okuma,

Düğüm ( Node )

Düğüm, dom içindeki en temel nesne tipidir. Aslında, bu makalenin sonraki kısımlarında da göreceğiniz gibi, dom ile tanımlanan neredeyse her nesne düğüm nesnesini genişletir. Ancak, semantikle ilgili daha ileri aşamalara geçmeden önce, bir düğümün temsil ettiği kavramı anlamanız gerekir; daha sonra, düğümün gerçek özelliklerini ve yöntemlerini öğrenmek sizin için çok kolay olacaktır.

31,229 okuma,

Creating Table onfly

For our DOM script, we're going to be working with a table. What's going to happen is we'll create a table

20,022 okuma,

Javascript ve Cookie ler 2

20,715 okuma,

Javascript Language Tips & Tricks

Javascriptle ?lgili Detaylar

17,955 okuma,

Javascript Yardımıyla Harici Css İçeriğini Sayfaya Dahil Etmek

Özellikle ajax ile yüklenen sayfalara harici css veya js dosya eklemek için 3 farklı yöntem.

20,332 okuma,

Object Oriented Javascript.

Neseneye Dayali Programlama Tekniklerini, Js de Benzetmeye Calışarak Yazacagımız Kodları Daha Okunaklı Düzenli, Genişleyebilir Ve Bakımı Kolay Yapılabilir Hale Getirebiliriz

21,318 okuma,

Javascript ve Nesneye Dayalı Programlama

Principles of Object-Oriented Programming in JavaScript

20,016 okuma,

Regular Expression - Düzenli ?fadeler

DÜzenli ifadeler (regular expressions veya kIsaca RegExp) herhangi bir karakter diziliminin yapIsInI yani iÇerdi?i karakterlerin neler oldu?u ile bunlarIn dizili? sIrasI (konumlarI) ve biÇimlerinin Önceden tanImlanan belli bir biÇime uyumunun denetlenmesi/sInanmasI sIrasInda kullanIlan standart gÖsterim biÇimleri ya da denetim ?ablonlarIdIr. DÜzenli ifadelerin kullanIlmasI ile sa?lanan en Önemli kolaylIk karakter dizimlerinde bulunan karakterlerin Önceden bilinen belli bir desenine uygun olup olmadI?InI sInama/deneme yetene?inden gelmektedir

29,735 okuma,

Child Nodeleri Silmek

When manipulating the DOM, it's often useful to remove all child nodes from a specific element. This typically comes in handy when you're looking to replace the content of an element with a separate form element, such as an , so the user can edit the actual value

18,203 okuma,

Javascript Ve Cookie Ler

Cookiler kullanarak ziyaretçilerinizin sayfalarına dilediğiniz değişken değerlerini kaydedebilirsiniz.

19,766 okuma, 17/05/2022

Uyarı Pencereleri

Bu sayfaya kadar JavaScript'in temellerini öğrenmek için alert(. ) ve document. Write(. ) komutlarıyla idare ettik. Artık JavaScript'in kodlarına ve inceliklerine ağırlık vereceğiz

21,977 okuma,

Javascripti Web Sayfasına Eklemek

18,251 okuma,

Javascript Events (Olaylar) Listesi

19,016 okuma,

Javascript ve HTML DOM (Objects) Nesneleri

21,023 okuma,

JavaScript Fonksiyon Referans Listesi

Javascript üstseviye, matematik, mantıksal, dizi, zaman, string fonksiyonları referans listesi

20,288 okuma,

Fonksiyonlar

19,048 okuma,

Objelere Ait Özellikler Listesi

18,934 okuma,

Akış Denetimleri

Her programda olduğu gibi, JavaScript'te de koşul deyimleri vardır. Bu deyimler Java ve C'de aynen kullanılmakta olan if. Else deyimi ve switch deyimi. Bu deyimleri bilmeyen arkadaşlarımız için bu sayfayı hazırladım

17,890 okuma,

Döngüler

Bu sayfamızda döngü denetimini ve bu döngü oluşturan döngü deyimlerinin üzerinde duracağız. Bunlar while. , do. While. ve for

19,236 okuma,

Akış Denetimleri

Akış denetimi ve döngü denetimi derslerimizde koşul ifadelerinin kullanıldığını gördük. Koşul deyimleri bu koşul ifadesine göre eleme yapıyor, döngü deyimleri bu koşul ifadesine göre çevrim oluşturuyordu. Ancak bu koşul ifadesi tek bir koşuldan oluşuyordu, acaba birden fazla koşulun sorgulanması mümkün müdür?

18,628 okuma,

Metin İşlemleri

Şu ana kadar document. başlangıçlı tek kod gördük: document. Write şimdilik bu kodla devam edeceğiz ve metinsel yöntemler üzerinde duracağız. DHTML sayfalarında document. başlangıçlı kodların hepsini ayrıca ele alacağız

20,460 okuma,

Diziler

Diziler programcılığın temel konularından biridir. Bu sayfada öğrenecekleriniz, diğer programlarda da aynen veya benzer şekilde yer almaktadır. Bu sayfayı hemen değişkenlerden sonra anlatmayı düşünüyordum ama daha önce hiçbir yazılım dili bilmeyen arkadaşlara Pencere ve Metin kodları gibi somut derslerin daha öncelikli olduğuna karar verdim. Şimdi diziler konusuna geçebiliriz

18,882 okuma,

Tarih-saat İşlemleri

Bu sayfada zaman yöntem kodları üzerinde duracağız. Bu kodlar zaman birimlerini ifade etmekte, nesneleri zamana göre sıralamakta ve sorgulamakta kullanılır

33,937 okuma,

Matematik İşlemleri

Programlar matematiğin bir dalı olan algoritmalar üzerine kuruludur. Matematiği kötü olup da iyi yazılımcı olabilen kişi yoktur. Eğer matematik üzerine daha önce fazla düşmemişseniz, belki program yaparken matematiği sevebilir ve içinizde kalmış gizli bir yeteneğinizi keşfedebilirsiniz

21,761 okuma,

Olaylar (Events)

JavaScript için olay nedir? Kullanıcının sayfa üzerinde yaptığı her türlü işlem olaydır. Sayfayı açmak, bir nesnenin üzerine tıklamak, fareyle bir nesnenin üzerine gelmek, bir tuşa basmak, bir değeri değiştirmek. Bunların hepsi bir olaydır. HTML nesneleridir ve küçük harfle veya büyük harfle yazılmalarında sakınca yoktur

20,336 okuma,

DHTML

Hareketli (dinamik) bir sayfa yapmak için, sayfa nesnelerini ve onlara komutlar vermeliyiz. Buna DHTML (dynamik hypertext markup language) denmektedir. Aslında DHTML diye bir dil veya standart yok, HTML nesneleri ve CSS özelliklerini JavaScript (veya başka bir dille) sayfa içinde değiştirerek, hareketli web sayfaları yaratma işlemidir. Fare imlecini kovalayan yaylar, toplar, martılar; üzerine gelindiğinde değişen ışıklı düğmeler; tıklanıldığında perde gibi açılan menüler; Star Wars jeneriğine benzeyen kayan metinler, daha neler neler

18,231 okuma,

document Nesnesi

Doküman (document) nesnesi HTML dokümanının tamamını ifade etmektedir ve HTML'de kullandığımız , , , vb. gibi tüm komutları içerir. Doküman nesnesini HTML'deki bölümü olarak düşünebilirsiniz

25,215 okuma,

Yükleniyor...
Yükleniyor...