HTML DOM Document addEventListener() ਮੈਥਡ
- ਪਿੱਛਲਾ ਪੰਨਾ activeElement
- ਅਗਲਾ ਪੰਨਾ adoptNode()
- ਪਿੱਛੇ ਵਾਪਸ ਜਾਓ HTML DOM Documents
ਪਰਿਭਾਸ਼ਾ ਅਤੇ ਵਰਤੋਂ
ਮੈਥਡ false ਲਈ, ਉਹ ਇੱਕ ਆਮ ਈਵੈਂਟ ਲਿਸਨਰ ਦੇ ਰੂਪ ਵਿੱਚ ਰਜਿਸਟਰ ਕੀਤਾ ਜਾਵੇਗਾ। ਮੰਥਨ ਈਵੈਂਟ ਹੈਂਡਲਰ ਨੂੰ ਦੌਨ 'ਤੇ ਜੋੜੋ。
ਇਨਸਟੈਂਸ
ਉਦਾਹਰਣ 1
ਦੌਨ ਨੂੰ click ਈਵੈਂਟ ਜੋੜੋ:
document.addEventListener("click", myFunction);
فانکشن myFunction() {}}
document.getElementById("demo").innerHTML = "Hello World";
}
سادہ نحویات:
document.addEventListener("click", function(){
document.getElementById("demo").innerHTML = "Hello World";
});
مثال 2
آپ دستاویز میں متعدد ایونٹ شنشنرز شامل کرسکتے ہیں:
document.addEventListener("click", myFunction1);
document.addEventListener("click", myFunction2);
مثال 3
آپ مختلف نوع کے ایونٹوں کو شامل کرسکتے ہیں:
document.addEventListener("mouseover", myFunction);
document.addEventListener("click", someOtherFunction);
document.addEventListener("mouseout", someOtherFunction);
مثال 4
پارامتر کی پاس کریں کے لئے، نا معین فانکشن کو پارامتر وار فانکشن کے طور پر بلند کریں:
document.addEventListener("click", function() {
myFunction(p1, p2);
});
مثال 5
دستاویز کی پس منظر رنگ بدلنے کا عمل:
document.addEventListener("click", function(){
document.body.style.backgroundColor = "red";
});
مثال 6
removeEventListener() کے طور پر استعمال کریں:
// ایونٹ شنشنیر کو شامل کریں
document.addEventListener("mousemove", myFunction);
// ایونٹ شنشنیر کو ہٹانے کے لئے
document.removeEventListener("mousemove", myFunction);
نحویات
document.addEventListener(نوع, فانکشن, capture)
پارامتر
| پارامتر | وصف |
|---|---|
| نوع |
ضروری ہے۔ ایونٹ نام لطفاً "on" پیشوند نہ کریں۔ لطفاً " کلیک " کا استعمال کریں اور نہ کہ "onclick"。 تمام HTML DOM ایونٹ درج ہیں: |
| فانکشن |
ضروری ہے۔ واقعیت واقع ہونے پر چلنے والا فانکشن。 当事件发生时，将事件对象作为第一个参数传递给函数。 事件对象的类型取决于指定的事件。例如，"click" 事件属于 MouseEvent 对象。 |
| capture |
可选（默认 = false）。
|
返回值
无。
技术细节
该方法将把指定的事件监听器函数添加到当前节点的监听器集合中，以处理指定类型 type 的事件。如果 capture ਇਹ ਮੈਥਡ ਸ਼ਾਇਦ ਕਈ ਵਾਰ ਬੁਲਾਇਆ ਜਾਵੇਗਾ, ਤਾਂ ਉਹ ਸ਼ਾਇਦ ਕਈ ਵਾਰ ਬੁਲਾਇਆ ਜਾਵੇਗਾ, ਜਦੋਂ ਇੱਕ ਹੀ ਨੋਡ 'ਤੇ ਇੱਕ ਹੀ ਪ੍ਰਕਾਰ ਦੇ ਈਵੈਂਟ ਲਿਸਨਰ ਰਜਿਸਟਰ ਕੀਤੇ ਜਾਵੇਗਾ। ਪਰ ਧਿਆਨ ਦੇਣਾ ਹੈ ਕਿ DOM ਕਈ ਈਵੈਂਟ ਲਿਸਨਰਾਂ ਦੇ ਬੁਲਾਉਣ ਦੀ ਕਿਸਮ ਨਹੀਂ ਪਛਾਣ ਸਕਦਾ ਹੈ。 capture ਮੈਥਡ true ਲਈ, ਤਾਂ ਲਿਸਨਰ ਇੱਕ ਕੈਪਚਰ ਈਵੈਂਟ ਲਿਸਨਰ ਦੇ ਰੂਪ ਵਿੱਚ ਰਜਿਸਟਰ ਕੀਤਾ ਜਾਵੇਗਾ। ਜੇਕਰ
ਮੈਥਡ false ਲਈ, ਉਹ ਇੱਕ ਆਮ ਈਵੈਂਟ ਲਿਸਨਰ ਦੇ ਰੂਪ ਵਿੱਚ ਰਜਿਸਟਰ ਕੀਤਾ ਜਾਵੇਗਾ। addEventListener()
ਜੇਕਰ ਇੱਕ ਈਵੈਂਟ ਲਿਸਨਰ ਫੰਕਸ਼ਨ ਇੱਕ ਹੀ ਨੋਡ 'ਤੇ ਇੱਕ ਹੀ type ਦੇ ਨਾਲ ਰਜਿਸਟਰ ਕੀਤਾ ਗਿਆ ਤਾਂ ਉਹ ਕਈ ਵਾਰ ਬੁਲਾਇਆ ਜਾ ਸਕਦਾ ਹੈ, ਇੱਕ ਹੀ ਨੋਡ 'ਤੇ ਇੱਕ ਹੀ ਪ੍ਰਕਾਰ ਦੇ ਈਵੈਂਟ ਲਿਸਨਰ ਰਜਿਸਟਰ ਕੀਤੇ ਜਾ ਸਕਦੇ ਹਨ। ਪਰ ਧਿਆਨ ਦੇਣਾ ਹੈ ਕਿ DOM ਕਈ ਈਵੈਂਟ ਲਿਸਨਰਾਂ ਦੇ ਬੁਲਾਉਣ ਦੀ ਕਿਸਮ ਨਹੀਂ ਪਛਾਣ ਸਕਦਾ ਹੈ。 capture ਪੈਰਾਮੀਟਰ ਦੋ ਵਾਰ ਰਜਿਸਟਰ ਕੀਤਾ ਗਿਆ ਤਾਂ ਦੂਜੀ ਵਾਰ ਰਜਿਸਟਰ ਕੀਤਾ ਗਿਆ ਹੋਵੇਗਾ ਅਣਦੇਖਿਆ ਜਾਵੇਗਾ। ਜਦੋਂ ਇੱਕ ਨੋਡ 'ਤੇ ਈਵੈਂਟ ਦੇ ਸਮਾਧਾਨ ਦੇ ਦੌਰਾਨ ਇਸ ਨੋਡ 'ਤੇ ਇੱਕ ਨਵਾਂ ਈਵੈਂਟ ਲਿਸਨਰ ਰਜਿਸਟਰ ਕੀਤਾ ਗਿਆ ਤਾਂ ਉਸ ਈਵੈਂਟ ਲਈ ਨਵੇਂ ਈਵੈਂਟ ਲਿਸਨਰ ਨੂੰ ਨਹੀਂ ਬੁਲਾਇਆ ਜਾਵੇਗਾ。
ਜਦੋਂ Node.cloneNode() ਮੈਥਡ ਜਾਂ Document.importNode() ਮੈਥਡ ਇੱਕ Document ਨੋਡ ਨੂੰ ਕਾਪੀ ਕਰਦੇ ਹੋਏ, ਮੂਲ ਨੋਡ 'ਤੇ ਰਜਿਸਟਰ ਕੀਤੇ ਗਏ ਈਵੈਂਟ ਲਿਸਨਰਾਂ ਨੂੰ ਨਹੀਂ ਕਾਪੀ ਕਰਦਾ ਹੈ。
ਇਹ ਮੈਥਡ ਵੀ Document ਅਤੇ Window ਆਬਜੈਕਟਾਂ 'ਤੇ ਪਰਿਭਾਸ਼ਿਤ ਹੈ, ਅਤੇ ਕੰਮ ਕਰਦਾ ਹੈ ਜਿਵੇਂ ਕਿ ਇਸ ਵਿੱਚ ਹੈ。
ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ
document.addEventListener ਇਹ DOM Level 2 (2001) ਵਿਸ਼ੇਸ਼ਤਾ ਹੈ。
ਸਾਰੇ ਬਰਾਉਜ਼ਰ ਇਸ ਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਕਰਦੇ ਹਨ:
| ਚਰਮੋਇਲ | ਆਈਈ | ਐਂਜਲ | ਫਾਇਰਫਾਕਸ | ਸਫਾਰੀ | ਓਪਰਾ |
|---|---|---|---|---|---|
| ਚਰਮੋਇਲ | ਆਈਈ | ਐਂਜਲ | ਫਾਇਰਫਾਕਸ | ਸਫਾਰੀ | ਓਪਰਾ |
| ਸਮਰਥਨ | 9-11 | ਸਮਰਥਨ | ਸਮਰਥਨ | ਸਮਰਥਨ | ਸਮਰਥਨ |
ਸਬੰਧਤ ਪੰਨੇ
ਏਲੀਮੈਂਟ ਮੈਥਡ
ਦਸਤਾਵੇਜ ਮੈਥਡ
ਟੂਰੀਅਲ
- ਪਿੱਛਲਾ ਪੰਨਾ activeElement
- ਅਗਲਾ ਪੰਨਾ adoptNode()
- ਪਿੱਛੇ ਵਾਪਸ ਜਾਓ HTML DOM Documents
