
jQuery Event
سوف تتعلم في هذا الدرس طريقة استخدام ال Events بواسطة مكتبة ال jQuery
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
jQuery Event
</> jQuery Event
كيف يتم ذلك ؟
تسمى جميع إجراءات الزوار المختلفة مع صفحة الويب ب بالأحداث Events.- الضغط علي اي زر من الازرار الموجوده بالفــأره ال Mouse مثل Left Click أو Right Click أو ال Scroll اثناء تصفحة صفحة الويب.
- الضغط علي اي زر موجود علي لوحة المفاتيح Keyborad اثناء تصفحة صفحة الويب.
- او استخدام النقر Touch باستخدام الاجهزة التي تدعم ال Touch Screen اثناء تصفحة صفحة الويب.
Mouse Events | Keyboard Events | Form Events | Form Events |
click | keypress | submit | load |
dblclick | keydown | change | resize |
mouseenter | keyup | focus | scroll |
mouseleave | - | blur | unload |
</> JQuery Events Syntax
$("p").click();
نقوم بكتابة function بداخل ال Event لتنفيذ مجموعة اوامر برمجية علي ال Element
$("p").click(function(){ // action goes here!! });
</> Hide Element With Event
تكتب جميع اوامر ال jQuery بداخل function ready لكي يتم تنفيذ ال Event عندما يتم تحميل وقراءة جميع ال HTML Elemnts علي المتصفح
يتم اخفاء ال Element p عندما يقوم الزائر بالضغط علي نفس ال Element عن طريق click Evenet
تحتوي ال click Event علي function بداخلها امر اخفاء ال Element p
$("p").click(function(){ $(this).hide(); });
</> dblclick Event
ال dblclick method تحتوي علي function يكتب بداخلها امر اخفاء ال Element عندما يقوم الزائر بالضغط مرتين double click علي زر ال mouse
$("p").dblclick(function(){ $(this).hide(); });
</> mouseenter Event
ال mouseenter method تحتوي علي function يكتب بداخلها امر اظهار ال alert عندما يقوم الزائر بتمرير زر ال mouse
$("#p1").mouseenter(function(){ alert("You entered p1!"); });
</> mouseleave Event
ال mouseleave method تحتوي علي function يكتب بداخلها امر اظهار ال alert عندما يقوم الزائر بتمرير زر ال mouse علي ال Element ثم تحريكه خارج حدوده مده اخري
$("#p1").mouseleave(function(){ alert("Bye! You now leave p1!"); });