كائن الحدث: عند حدوث حدث ما ، يقوم المتصفح تلقائيًا بإنشاء الكائن ويحتوي على نوع الحدث ، وإحداثيات الماوس ، إلخ.
خصائص كائن الحدث: التنسيق: event.properties.
بعض التعليمات:
يمثل الحدث حالة الحدث ، مثل العنصر الذي يؤدي إلى كائن الحدث ، وموضع وحالة الماوس ، والمفتاح المضغوط ، وما إلى ذلك.
كائن الحدث صالح فقط أثناء الحدث.
يختلف الحدث في Firefox عن ذلك في IE. الحدث في IE هو متغير عالمي متاح في أي وقت ؛ يجب تشغيل الحدث في Firefox بالمعلمات ، وهو متغير مؤقت في وقت التشغيل.
في IE/Opera إنه نافذة.
الهدف من الحدث هو window.event.srcelement في IE ، Event.Target in Firefox ، وكلاهما متاح في الأوبرا.
أحداث ملزمة
في JS ، يمكنك عادةً أن تأخذ طريقتين لربط الأحداث بكائن (التحكم):
حدد الوظيفة أولاً في الرأس:
نسخة الكود كما يلي:
<script type = "text/javaScript">
وظيفة ClickHandler ()
{
// افعل شيئًا
تنبيه ("يتم النقر فوق الزر!") ؛
}
</script>
الطريقة الأولى لربط الأحداث:
<type type = "button" value = "button1" onClick = "ClickHandler () ؛"> <br/>
الطريقة الثانية لربط الأحداث:
نسخة الكود كما يلي:
<type type = "button" id = "button2" value = "button2">
<script type = "text/javaScript">
var v = document.getElementById ("button2") ؛
v.onclick = clickHandler ؛ // استخدام اسم الوظيفة هنا ، لا تتم إضافة قوسين
</script>
أمثلة أخرى
مثال 1:
نسخة الكود كما يلي:
<! doctype html>
<html>
<head>
<title> eventTest.html </itlem>
<meta http-equiv = "الكلمات الرئيسية" content = "Keyword1 ، Keyword2 ، Keyword3">
<meta http-equiv = "description" content = "This is is my past">
<meta http-equiv = "content-type" content = "text/html ؛ charset = utf-8">
<!-<link rel = "stylesheet" type = "text/css" href = "./ Styles.css">->
<script>
الدالة محرك (كائن) {
Object.Color = "Red" ؛
}
وظيفة mout (كائن) {
Object.Color = "Blue" ؛
}
</script>
</head>
<body>
<font style = "Cursor: Help"
onClick = "window.location.href = 'http: //www.baidu.com' '"
onMouseover = "Mover (this)" onMouseout = "Mout (this)"> مرحبًا </font>
</body>
</html>
مثال 2:
نسخة الكود كما يلي:
<! doctype html>
<html>
<head>
<title> eventTest2.html </itlem>
<meta http-equiv = "الكلمات الرئيسية" content = "Keyword1 ، Keyword2 ، Keyword3">
<meta http-equiv = "description" content = "This is is my past">
<meta http-equiv = "content-type" content = "text/html ؛ charset = utf-8">
<!-<link rel = "stylesheet" type = "text/css" href = "./ Styles.css">->
</head>
<body>
<script type = "text/javaScript">
وظيفة getEvent (الحدث) {
ALERT ("نوع الحدث:" + event.type) ؛
}
document.write ("انقر ...") ؛
document.onmousedown = getEvent ؛
</script>
</body>
</html>