دوره مجازی جاوااسکریپت (جلسه 10): event ها و کنترل رفتار کاربران در جاوااسکریپت

دسته بندی: جاوا اسکریپت
زمان مطالعه: ۲ دقیقه
۲۰ خرداد ۱۳۹۴

به جرات میشه گفت چیزی که جاوااسکریپت رو در سمت وب بسیار کاربردی، قدرتمند و جذاب کرده توانایی اون در مدیریت و کنترل رفتار کاربران و مرورگر اون ها در صفحات وب هست . امروز می خوایم در مورد بحث بسیار مهم event ها در جاوا اسکریپت و کنترل رفتار کاربران و مرورگرها در صفحات وب صحبت کنید و ببینیم چطوری میشه تعین کرد زمانی که کاربری فعالیت خاصی انجام داد بخش خاصی از کدهای جاوااسکریپت اجرا بشه! در این جلسه 3 تا مینی پروژه بسیار جالب هم داریم و یک بازی جذاب هم با هم خواهیم نوشت که در اون عنکبوتی باید به دنبال مگس بره و اون رو بخوره !!!

مطالب مطرح شده در این جلسه عبارتند از :

  •  معرفی رویدادها در جاوااسکریپت و اهمیت آن ها
  • ذکر مثال هایی از event های رایج در صفحات وب
  • روش های توزیع رویدادها (Event Propagation) در جاوااسکریپ و مفهوم آن ها
  • لیست event های موجود و توضیح مهمترین آن ها
  • دو روش استفاده از رویداد ها و اتصال کدهای جاوااسکریپت به event ها
  • روش استفاده درون تگ های html و ویژگی رویدادی  آن تگ
  • روش استفاده از متد addEventListener اتصال رویداد به توابع به شکل برنامه نویسی
  • متد addEventListener برای افزودن یک رویداد و اتصال یک تابع به آن
  • مشکل و ناسازگاری IE9 به پایین به متد addEventListener و removeEventListener
  • متد attachEvent برای استفاده در مرورگر اینترنت اکسپلور ورژن 9 به پایین
  • متد removeEventListener برای حذف یک event از قبل وصل شده
  • متد detachEvent برای استفاده در مرورگر اینترنت اکسپلور ورژن 9 به پایین
  • توانایی تعریف چندین eventListener برای یک شی
  • استفاده از توابع ناشناخته (anonymouse functions) در eventListener ها
  • نحوه اتصال یک event به توابعی که پارامتر ورودی دارند
  • مینی پروژه : نمایش ابعاد پنجره مرورگر در حین تغیر سایز آن توسط کاربر
  • مینی پروژه : نمایش موقعیت اسکرول صفحه وب در حین اسکرول کردن توسط کاربر
  • مینی پروژه : طراحی و کدنویسی یک بازی جذاب، گرفتن مگس توسط عنکبوت با استفاده از دکمه های جهت کیبرد
  • نحوه تمرین کردن برای تسلط در کار با رویدادها
:: توجه

این مطلب یک جلسه از آموزش javascript می باشد و برای مشاهده آن باید در دوره ثبت نام کنید.

ثبت نام در آموزش javascript

نویسنده
بیش از 15 سال هست که برنامه نویسی می کنم و از بین همه زبون هایی که کار کردم جاوا، اسمبلی و php رو دوست دارم. دانشجوی دکترای نرم افزارم و توی دانشگاه روی پردازش بیگ دیتا و پردازش موازی کار کردم و عاشق چالش از هر نوعیش هستم! سون لرن مثل بچه منه که 12 سال براش وقت گذاشتم، اینجا همه تلاش می کنیم از شروع یادگیری تا ورود به بازر کار حوزه برنامه نویسی و IT همراهتون باشیم.

جلسات دوره

نظرات کاربران

حمیدرضا صفری

سلام دوستان من بازی شکار پشه رو که جناب آوند در این جلسه طراحی کردن رو گسترش دادم
به این صورت که تعداد پشه ها بین 1 تا 10 هر بار به صورت تصادفی ایجاد میشه و وقتی که آخرین پشه شکار بشه پیام برنده شدن ظاهر میشه
من لینک دانلودش رو براتون میذارم
فقط لطفا هر کس که تا پایان این دوره این بازی رو گسترش میده اگه دوس داره با بقیه به اشتراک بذاره تا هممون از تجربیات همدیگه استفاده کرده باشیم
مرسی
https://trainbit.com/files/6662362884/7LearnExtendedGame.zip

لقمان آوند

خیلی خوبه
ممنون از تلاشتون

سعید ریحانی

سلام وقت بخیر
ممنونم از شما ، متوجه ایراد کار شدم این دستورات document.documentElement.scrollTop فکر میکنم زمانی جواب میده که اون المنت scrollable باشه ولی من چون میخواستم موقعیت اسکرول پنجره رو نشون بده باید از window.pageOffsetTop استفاده میکردم که با این جواب داد.
حالا نمیدونم این حرفی که زدم درسته یا نه و این کاری که انجام دادم درسته یا نه

لقمان آوند

documentElement مربوط به سند هست و window پنجره مرورگر . و پوزیشن مربوطه هم نسبت به همین موارد داده میشه

لقمان آوند

سلام
در تابع setScrollPos به جای document.body.scrollTop از document.documentElement.scrollTop استفاده کنید.

پایان زمان پشتیبانی

دانشجوی گرامی، بازه پشتیبانی فعال برای این دوره ۳ ماه است که برای شما به پایان رسیده است.

شما هم چنان می توانید سوالات خود را در این قسمت بپرسید اما اولویت پاسخ گویی با دانشجویانی است که بازه پشتیبانی فعال دارند.

نیاز به لاگین

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