وب

متد های رویداد های جی کوئری

متد های رویداد های جی کوئری

جی کوئری برای رویداد ها در یک صفحه HTML به صورت سفارشی آماده شده است.(توصیه می شود دوره آموزشی طراحی سایت و پکیج آموزش طراحی سایت  را مشاهده کنید)

رویداد های جی کوئری

رویداد های جی کوئری اقداماتی هستند که می توانند توسط برنامه وب شما شناسایی شوند. رویداد های جی کوئری برای ایجاد صفحات وب پویا استفاده می شوند. یک رویداد به طور دقیق، لحظه ای را که اتفاق می افتد نشان می دهد.

رویداد های جی کوئری

این موارد نمونه هایی از رویداد ها هستند

کلیک ماوس

ارسال فرم HTML

بارگذاری صفحه وب

فشار دکمه ای روی صفحه کلید

پیمایش صفحه وب و غیره

این رویداد ها را می توان بر اساس انواع آن ها دسته بندی کرد:

رویداد های جی کوئری و رویداد های ماوس

کلیک

دابل کلیک dblclick

mouseenter

mouseleave

رویداد های صفحه کلید در رویداد های جی کوئری

وارد کردن

Keedown

keyup

فشردن کلید keypress

رویداد های جی کوئری و رویداد های فرم

ارسال فرم

تغییر دادن

تار شدن blur

تمرکز کردن focus

رویداد های سند / پنجره

بارگذاری load

تخلیه unload

طومار یا scroll

تغییر اندازه

نکته: اصطلاح “آتش” به طور کلی با رویداد ها مورد استفاده قرار می گیرد. به عنوان مثال: رویداد کلیک در لحظه ای که یک کلید را فشار می دهید، آتش می گیرد.

رویداد های جی کوئری

سینتکس برای متد رویداد های جی کوئری

بیشتر رویداد های DOM یک روش جی کوئری معادل دارند. برای اختصاص دادن یک رویداد کلیک به تمام پاراگراف ها در یک صفحه، این کار را باید انجام دهید:

گام بعدی تعیین می کند که چه اتفاقی باید بیافتد وقتی که رویداد در اصطلاح آتش می گیرد یا رخ می دهد. شما باید یک تابع را به رویداد منتقل کنید.

رویداد های جی کوئری در حقیقت چه هستند؟

تمام اقدامات بازدید کننده های مختلف که یک صفحه وب می تواند به آن ها پاسخ دهد، رویداد نامیده می شوند.

یک رویداد نشان دهنده لحظه دقیق زمانی است که چیزی اتفاق می افتد.

مثال ها:

حرکت دادن یک ماوس بر روی عنصر

انتخاب دکمه رادیویی

کلیک کردن بر روی عنصر

اصطلاح “fires/fired” اغلب با رویداد ها استفاده می شود. مثال: لحظه ای که کلید را فشار می دهید، رویداد keypress اتفاق می افتد،

در این جا برخی از رویداد های معمول DOM آورده شده است:

Mouse Events Keyboard Events Form Events Document/Window Events
click keypress submit load
dblclick keydown change resize
mouseenter keyup focus scroll
mouseleave blur unload

سینتکس استفاده از جی کوئری برای متد های رویداد

در جی کوئری، اکثر رویداد های DOM یک روش جی کوئری معادل دارند.

برای اختصاص دادن یک رویداد کلیک به همه پاراگراف ها در یک صفحه، می توانید این کار را انجام دهید:

گام بعدی این است که تعریف کنیم چه اتفاقی می افتد وقتی که رویداد رخ می دهد. شما باید یک تابع را به رویداد اختصاص دهید:

روش های معمول مورد استفاده رویداد های جی کوئری

()document).ready)$

روش  () (document) .ready$  به ما اجازه می دهد یک تابع را هنگامی که سند به طور کامل بارگذاری می شود اجرا کنیم.

کلیک ()click

متد ()click تابع پردازش رویداد را به یک عنصر HTML متصل می کند.

این عمل هنگامی انجام می شود که کاربر روی عنصر HTML کلیک کند.

مثال زیر می گوید: هنگامی که یک رویداد کلیک بر روی عنصر <p> عمل می کند؛ عنصر فعلی <p>، پنهان می شود.

Example

رویداد های جی کوئری و دابل کلیک ()dblclick

متد ()dblclick تابع پردازش رویداد را به یک عنصر HTML متصل می کند.

این عمل هنگامی انجام می شود که کاربر بر روی عنصر HTML دوبار کلیک کند:

Example

mouseenter() در رویداد های جی کوئری

متد ()mouseenter تابع پردازش رویداد را به یک عنصر HTML متصل می کند.

هنگامی که نشانگر ماوس به روی عنصر HTML حرکت می کند، این تابع اجرا می شود:

Example

mouseleave() در رویداد های جی کوئری

متد mouseleave() تابع پردازش رویداد را به یک عنصر HTML متصل می کند.

این عمل هنگامی انجام می شود که اشاره گر ماوس عنصر HTML را ترک کند:

Example

mousedown() در رویداد های جی کوئری

متد mousedown() تابع پردازش رویداد را به یک عنصر HTML متصل می کند.

این تابع زمانی اجرا می شود که دکمه سمت چپ، میانی یا راست را فشار داده، در حالی که نشانگر ماوس بر روی عنصر HTML قرار گرفته است:

Example

mouseup() در رویداد های جی کوئری

متد () mouseup تابع پردازش رویداد را به یک عنصر HTML متصل می کند.

این تابع زمانی اجرا می شود که کاربر، دکمه سمت چپ، میانی یا راست را رها کند، در حالی که نشان گر ماوس بر روی عنصر HTML قرار گرفته است:

Example

شناور یا hover() در رویداد های جی کوئری

متد () hover دو عمل را انجام می دهد و ترکیبی از روش () mouseenter و () mouseleave است.

اولین تابع زمانی اجرا می شود که ماوس وارد محدوده عنصر HTML شود و تابع دوم هنگامی که ماوس محدوده عنصر HTML را ترک می کند، اجرا می شود:

Example

رویداد های جی کوئری و تمرکز یا focus()

متد focus() تابع پردازش رویداد را به یک فیلد فرم HTML متصل می کند.

وقتی که بر فیلد فرم تمرکز می شود، تابع اجرا می شود:

Example

رویداد های جی کوئری و تاری یا blur()

متد () blur تابع پردازش رویداد را به یک فیلد فرم HTML متصل می کند.

وقتی که فیلد فرم از تمرکز خارج می شود، تابع اجرا می شود:

Example

متد () on در رویداد های جی کوئری

متدon()  یک یا چند تابع پردازش رویداد را به عناصر انتخاب شده متصل می کند.

پیوست کردن یک رویداد کلیک به یک عنصر <p>:

مثال

پیوست کردن چندین رویداد به یک عنصر <p> :

مثال

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

همچنین ببینید
بستن
دکمه بازگشت به بالا