توضیح:
زمانیکه بر روی المنتی کلیک می شود این رویداد فراخوانی می شود.
نحوه نوشتن:
در حالت خصوصیت تگ HTML:
|
1 |
<element onclick="myScript"> |
در داخل جاوااسکریپت:
|
1 |
object.onclick = function(){myScript}; |
در قالب متد addEventListener:
|
1 |
object.addEventListener("click", myScript); |
تگ های پشتیبان کننده:
|
1 2 |
همه المنت ها بغیر از: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, <title> |
نسخه پشتیبانی مرورگرها:
| مرورگر Chrome | مرورگر Firefox | مرورگر Edge | مرورگر Safari | مرورگر Opera |
|---|---|---|---|---|
| همه نسخه ها | همه نسخه ها | همه نسخه ها | همه نسخه ها | همه نسخه ها |
حالت Bubbles:
بله
حالت Cancelable:
بله
مثال:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <button onclick="myfunction()">click me!</button> <p></p> <script> function myfunction(){ document.querySelector('p').innerText = "Hello World!"; } </script> </body> </html> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <button onclick="myfunction()">click me!</button> <p></p> <script> document.querySelector("button").onclick = function (){ document.querySelector("p").innerText = "you clicked"; } </script> </body> </html> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <button>click me!</button> <p></p> <script> document.querySelector("button").addEventListener("click",function (){ document.querySelector("p").innerText = "you clicked"; }); </script> </body> </html> |
